Selection Controls

Checkboxes allow users to select/deselect an item or items from a list. A checkable input communicates if an option is true, false, or indeterminate. They can be used to make any number of choices, including zero, one, or several. Checkboxes must include a clear, contextual label to help the user make their selection.

A Dropdown Select allows users to choose options from a list of predefined choices. It's a space-saving way to offer selections without cluttering the interface.

Radios allow users to make a single selection from a list and are shown in a group of two or more.

The Segment Control component allows users to switch between mutually exclusive options. It provides a compact, intuitive way to modify content views or change settings.

A toggle switch allows users to quickly switch between two opposing options. It behaves similarly to a physical switch, where a user clicks the switch to change its position.

Tabs are used to group related content at the same hierarchical level. They allow the user to be able to alternate between views within the same context.