Skip to main content

Segmented Controls

A segmented control is a navigation or input element that presents a set of mutually exclusive options in a segmented layout.

Overview

The purpose of segmented controls is to provide users with a clear and visually appealing way to choose from a set of mutually exclusive options. They simplify navigation and input by presenting options in a compact and easily scannable format.

Segmented controls are often used to allow users to switch between different views, filter content, or make a selection from a set of options. Each segment functions as a separate button or tab, and when one segment is selected, the others are automatically deselected.

A segmented control with two segments.

Resources

We’re currently working on updating our Segmented Controls documentation, please see the resources below.
Stable
Stable
Stable
Stable
Web Components
Planned
Stable
Stable
iOS JustUI [UI Kit]
Stable
iOS PIE [SwiftUI]
Stable
Android PIE [Compose & Views]
Planned
Back to top