When to use
- To toggle between related views or data sets, like switching between “List view” and “Grid view”.
- To filter content by category, such as “All”, “Private”, “Public”.
- When you want to provide quick, mutually exclusive choices that immediately affect the display without navigating away.
- When the options are closely related and equal in hierarchy.
- For primary view switches.
When to use something else
- Options need longer descriptions or aren’t a tight filter set: use Radio.
- Larger content sections or page-scale switching: use Tabs.
- Binary on/off: use Switch.
- Mutually exclusive actions (not views): use Toolbar or Toggle group as appropriate.
- More than ~five options or multi-select: use Select, Combobox, or Tree view.
Dos and don’ts
- Do pre-select a default option that is most common or aligns with the primary task.
- Do be consistent in icon and label usage. If using a leading icon for one control, use them for all.
- Do keep the options between 2-5 so as not to overwhelm the user.
- Don’t use Segmented control for unrelated actions.
- Don’t mix icon-only with label-only.
- Don’t use Segmented control to trigger actions like “Save” or “Delete”.