Components

Components are the systematic building blocks of our design system that empower users to create consistency across their products.

A badge is a visual indicator that represents numeric values such as counters.

Buttons enable a user to initiate a specific action.

Cards are versatile content structures that group related concepts and tasks together as well as provide an entry point to more complex and detailed information.

Checkbox groups display a related set of options where multiple options can be selected.

Checkboxes allow users to select one or more options from a group of options.

A divider creates visual hierarchy and rhythm within a layout by partitioning content into meaningful sections.

Icons are graphic representations of concepts and actions that help establish context and purpose for other user interface elements.

An input is a field that allows a user to enter and interact with text and numeric values.

A list group organizes related list items into a contained unit.

A list item is a singular representation of an object or piece of data.

A menu is a self-contained list of actionable choices.

A notification communicates to a user timely or important information.

A progress indicator provides feedback to a user regarding loading and waiting states.

Radio groups display a related set of options where only one option can be selected.

Radios allow users to select only one option from a group of two or more options.

A switch allows users to select between one of two opposing states or options.

A toast is a temporary notification that informs users on the outcome of an action.

Tooltips provide contextual information when a user hovers over a related element.