Loading & skeleton
Spinners for short waits and skeletons that hold the layout while content loads.
In Figma
Section titled “In Figma”From guidelines/components/progress-loading.md
Properties, variants and anatomy of the Figma components.
Loading indicator
Section titled “Loading indicator”Spinner for page or section loading.
Variants: 2
| Property | Type / options |
|---|---|
| Show label | boolean (on) |
| Size | sm · md |
Skeleton
Section titled “Skeleton”Loading placeholders.
Variants: 3
| Property | Type / options |
|---|---|
| Type | Text · Avatar + text · Card |
Loading indicator
Section titled “Loading indicator”Do
- Use for short waits where the layout is unknown.
Forbidden
- Never block a whole page with a spinner when a skeleton fits.
Skeleton
Section titled “Skeleton”Do
- Match the skeleton to the layout that will load.
Forbidden
- Never leave a skeleton for more than a few seconds without a message.