UI Components
Four ready-to-use components that inject their CSS automatically — no stylesheet imports needed. All accept any CSS color value.
Loader vars4
Loader sizes5 (xs→xl)
Toast types5
CSSauto-inject
Experience Platform
Loader — 4 Variants
spinner
ring
pulse
Sizes (spinner)
xs
sm
md
lg
xl
Toast — 5 Types
Skeleton
EmptyState
API Reference
Detailed breakdown of all available options and returned states.
Hook Options
| Property | Type | Default | Description |
|---|---|---|---|
| variant | 'spinner' | 'dots' | 'pulse' | 'ring' | 'spinner' | Visual style of the loader. |
| size | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'md' | Standard size presets. |
| color | string | currentColor | Any valid CSS color. |
API Reference
Detailed breakdown of all available options and returned states.
Hook Options
| Property | Type | Default | Description |
|---|---|---|---|
| variant | 'text' | 'circle' | 'rect' | 'card' | 'text' | Shape of the skeleton block. |
| count | number | 1 | Repeat the skeleton multiple times. |
| width/height | string | — | Custom dimensions (px, %, etc). |
| color | string | — | Base background color. |
| highlightColor | string | — | Shimmer effect color. |
API Reference
Detailed breakdown of all available options and returned states.
Hook Options
| Property | Type | Default | Description |
|---|---|---|---|
| icon | ReactNode | — | Custom icon or SVG. |
| title | string | — | Main heading text. |
| description | string | — | Subtext explaining the state. |
| action | ReactNode | — | Call to action button or link. |