← All matrices

Spinner

4 sizes × 2 colors. Used inside Button when loading, or standalone for full-page loading.

Source react/src/atoms/Spinner.tsx Bundle 0.55 KB min / 0.37 KB gz LOC 35
Color xs (16) sm (24) md (32) lg (48)
primary
current (white on dark)

In context (Button loading)

UsageRender
Inside Button
Full-page (md)
Loading content…
Empty state (lg)
Fetching reports…
Props: size (xs|sm|md|lg), color (primary|current).
ARIA: role="status" + aria-label="Loading".