Layout.skeleton
Server-rendered
Animated skeleton placeholder.
Single line placeholder
<.skeleton class="h-4 w-[220px]" />
Avatar + text row
<div class="flex items-center gap-3">
<.skeleton class="size-10 rounded-full" />
<div class="space-y-2">
<.skeleton class="h-4 w-[180px]" />
<.skeleton class="h-4 w-[120px]" />
</div>
</div>
Card loading state
<.card class="max-w-sm">
<.card_header>
<.skeleton class="h-5 w-[140px]" />
<.skeleton class="h-4 w-[220px]" />
</.card_header>
<.card_content class="space-y-2">
<.skeleton class="h-4 w-full" />
<.skeleton class="h-4 w-[90%]" />
<.skeleton class="h-4 w-[75%]" />
</.card_content>
</.card>
Attributes
| Name | Type | Default | Values | Global Includes |
|---|---|---|---|---|
class
|
:string |
— | — | — |
rest
|
:global |
— | — | — |
Slots
No slots declared.