Component
Skeleton
Animated placeholder block for loading states. Size it with utility classes.
jsx
<div className="flex items-center gap-3">
<Skeleton className="w-10 h-10" rounded="rounded-full" />
<div className="flex-1 space-y-2">
<Skeleton className="h-3 w-3/4" />
<Skeleton className="h-3 w-1/2" />
</div>
</div>Props
| Prop | Type | Default | Description |
|---|---|---|---|
className
|
string | '' | Width / height utilities for the block. |
rounded
|
string | 'rounded-lg' | Corner radius utility (e.g. rounded-full). |