Skeleton
Placeholder shapes shown while content loads. Match the layout of the real content so nothing jumps. Use for loads longer than about 300 ms; use Spinner for short actions.
Shapes
Shown on a surface, as they appear in real layouts.
<Skeleton />
<Skeleton shape="circle" />
<Skeleton shape="rect" width={240} height={140} />Card
Mirror the real layout so nothing jumps.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
shape | "text" | "circle" | "rect" | "text" | Shape. |
width / height | number | string | — | Match the real content. |