View all

Triggers an action with six semantic variants and optional token-driven material depth.

A button whose whole label is an icon, always carrying an accessible name.

Navigates. Three variants for running text, navigation lists and utility links.

Coordinates single or multiple pressed options with roving keyboard focus.

A visible, programmatically-associated name for a form control.

A single-line text field, and the states every other form control follows.

A multi-line text field for longer answers, with optional character counting.

Choose one option from a known list, with typeahead and full keyboard support.

Search and select one option from a long static or asynchronous dataset.

Selects zero or more options, including the mixed state for partial groups.

Choose exactly one option from a small set shown at the same time.

Turns something on or off, committing the change immediately.

Captures or displays an ordered score with accessible star controls.

A short, non-interactive label reporting status or category.

A semantic key cap for keyboard shortcuts and interaction guidance.

A compact count or dot announcing unread activity on a control or destination.

Identifies a person, team or project, falling back to initials.

A bordered container grouping related content into one unit.

A contextual message communicating status, consequence or a next step.

A brief non-blocking notification for success, error, warning or information.

Preserves predictable content geometry while nearby data is loading.

Communicates determinate or indeterminate completion in a horizontal track.

A compact standalone indicator for an indeterminate loading state.

Semantic primitives for structured rows, columns and selected data.

A horizontal or vertical boundary between adjacent content groups.

Switches between sibling views inside one page, without navigating.

A horizontal set of peer destination links with a current-page state.

Shows hierarchical location and links back to parent destinations.

Moves through a known number of result pages with compact boundaries.

A stacked disclosure group for revealing secondary content in place.

Expands one independent region of optional secondary information.

A list of commands opened from a button, with submenus and shortcuts.

A focus-managed contextual surface anchored to an interactive trigger.

A short supplementary label revealed on hover or focus.

A modal surface that interrupts the task to ask for a decision.

A focus-trapped overlay panel entering from a viewport edge.