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

Stable
Stable
Web Components
Planned
Stable
Stable
iOS JustUI [UI Kit]
Stable
iOS PIE [SwiftUI]
Stable
Android PIE [Compose & Views]
Planned