components

Inline alert with 4 colour variants, optional leading + trailing icons, and up to 2 action buttons.

Circular avatar in 3 modes (image / icon / initials) × 4 sizes, with optional status notifier dot.

Pill-shaped badge with 5 tones × 2 styles (light/heavy), optional leading icon or number bubble.

Button with 5 visual types × 3 sizes. Optional leading/trailing icons, loading and disabled states.

Three-state checkbox (selected / indeterminate / unselected) at two sizes.

Empty-state card with illustration, heading, description and primary/secondary actions.

Input with 4 types — text, number, textbox (multi-line) and otp. Focused / error / disabled states.

Radio button at two sizes with selected / unselected / disabled states.

Pill-shaped segmented control with 2–4 segments at two sizes (small / big).

Tab strip with underline indicator on the active tab.

Mobile-style title bar — surface × leading icon × trailing icons + optional subtitle.

Switch / toggle with on, off and disabled states.

Tooltip with heading, body and close — 6 tail positions controlling where the pointer attaches.