Components

Primary actions. 7 variants × 3 sizes × 6 states.

Compact icon actions. 6 variants × 3 sizes × 5 states.

Attached segmented actions. 3 variants × 3 sizes.

Inline navigation text. 3 colors × 4 states.

Text field with label & helper. 3 styles × 3 sizes × 7 states.

Dropdown trigger. 3 styles × 3 sizes × 5 states.

Multi-line input. 3 styles × 4 states.

Search bar with shortcut hint. 3 sizes × 3 states.

Numeric field with steppers. 3 sizes × 3 states.

One-time code / PIN boxes. 2 lengths × 4 states.

Searchable select with listbox. 2 states.

Multi-select control. 3 values × 4 states.

Single-select control. 2 values × 4 states.

On/off toggle. 2 values × 4 states × 2 sizes.

Value & range picker. 2 types × 4 states.

Exclusive option switcher. 3 lengths × 2 sizes.

Filter / input tag. 3 styles × 4 states.

Field that collects tags. 3 states.

Pressable on/off button + group. 2 variants × 2 values × 2 sizes.

Radio / checkbox cards. 2 types × 4 states.

Month calendar. 2 types.

Drag & drop zone. 4 states.

Star rating. 6 values × 2 sizes.

Tab item + tab bar. 3 styles × 4 states.

Location trail. 2 separators × 2 lengths.

Page navigation. 3 styles.

Top app bar. 4 themes.

Vertical navigation + sidebar. 4 states × 2 types.

Progress steps. 4 statuses.

Menu item + dropdown menu. 2 types × 3 states.

Mobile tab bar. 3 lengths × 2 themes.

Nested tree rows + tree. 3 levels × 3 states.

Site footer. 2 types × 2 themes.

Inline feedback. 4 types × 4 styles.

Page-wide announcement. 5 types.

Transient notification. 4 types × 2 themes.

Contextual hint. 4 placements × 2 themes.

Linear progress bar. 5 values.

Circular progress. 5 values × 2 sizes.

Loading indicator. 3 sizes × 3 colors.

Loading placeholder. 4 types.

No data / error screens. 4 types.

Inbox / activity item. 2 statuses × 2 types.

Consent prompt. 2 layouts.

Status labels. 5 colors × 3 styles × 2 sizes.

User image / initials. 5 sizes × 2 types × 2 shapes.

Stacked avatars. 3 sizes.

Content container. 3 styles.

KPI / metric card. 3 trends × 2 styles.

Rows for lists & settings. 4 types.

Data table rows + table. 4 types.

Expandable section. 2 states × 3 styles.

Section separator. 4 types.

Keyboard shortcut. 2 styles × 2 sizes.

Activity feed + timeline. 3 statuses.

Label / value details. 2 layouts.

Code snippet with copy. 2 themes.

Blockquote & pull quote. 3 styles.

Chart card (bar, line, donut). 3 types.

Dialog with actions. 3 sizes.

Anchored floating panel. 2 placements.

Side sheet. 2 sides.

Mobile sheet. 2 types.

⌘K search & actions. 2 states.