Component catalog

Run an application action with native button semantics.

Compose related buttons into one action group.

Expose a compact set of application destinations.

Edit a value in place within existing content.

Reveal related actions from a compact trigger.

Offer a primary action and related menu choices.

Choose states using a group of toggle buttons.

Compose commands for the current task.

Suggest matching choices while the user types.

Choose a value through nested options.

Edit a boolean choice in a form.

Choose and edit a color value.

Edit civil dates, times, ranges or multiple dates.

Compose a field with its label, help and error.

Edit a text value with label and validation state.

Compose an input with related adornments or actions.

Guide text entry through a defined mask.

Enter a short verification code across cells.

Enter and manage a collection of text tags.

Adjust a numeric value with a circular control.

Choose items from a visible list of options.

Edit a numeric quantity rather than plain text.

Reorder a collection of items.

Enter a password with its dedicated field behavior.

Move choices between source and target collections.

Represent one exclusive choice within a group.

Compose and manage mutually exclusive choices.

Choose or display an ordered rating value.

Edit formatted text content.

Choose one or several values from options.

Adjust a value along a linear range.

Toggle a boolean setting on or off.

Edit multi-line text.

Choose values from a hierarchy.

Select and manage files for application upload.

Explore dates and events in calendar views.

Present a collection of records as a content view.

Compose filtering controls for a collection.

Organize work items in workflow columns.

Navigate between pages of a record collection.

Present flat records with columns and data interactions.

Lay out timeline items within a structured grid.

Explore and interact with hierarchical nodes.

Present hierarchical rows with tabular columns.

Render a visible window into a large list.

Expand related sections without leaving the page.

Show a location within a navigation hierarchy.

Find and run commands from a searchable palette.

Organize a large set of navigation destinations.

Present top-level menus in a horizontal bar.

Open a menu from a button trigger.

Present a list of commands or destinations.

Compose application navigation destinations.

Return to the top of a scrolling surface.

Guide a task through an ordered set of steps.

Supply the content of one Tabs section.

Switch between related content sections.

Organize commands in nested menu levels.

Present a focused task in a bottom overlay.

Request confirmation in a modal dialog.

Request confirmation beside a contextual trigger.

Open a modal task with application-owned state.

Present navigation or content in a side surface.

Show a contextual warning, error or confirmation.

Attach a small count or status to another element.

Block a surface while an operation is in progress.

Represent a compact item with optional interaction.

Explain an empty result and its next action.

Compare several measured values in one group.

Browse application notifications and their state.

Show progress for an application operation.

Reserve the shape of content while it loads.

Indicate that an operation is still running.

Display a compact status or classification.

Host transient application notifications.

Identify a person or entity with an image or initials.

Compose several avatars into one group.

Group a content summary and its related actions.

Move through a sequence of content items.

Display source code with readable formatting.

One before/after comparator, composed with Item, Handle and Indicator.

Auxiliary accessible range control inside Compare, not a separate comparator.

Auxiliary visual separator inside Compare, not a separate comparator.

Auxiliary before/after content surface inside Compare, not a separate comparator.

Arrange application panels in a configurable grid.

Separate content groups without adding a container.

Group related fields under a legend.

Browse an image or media collection.

Group content in a titled surface.

Provide a scrollable content region.

Resize adjacent application panels.

Present a focused metric and supporting context.

Present a terminal-style command interaction.

Present an ordered sequence of events.