Skip to main contentCarbon Design System

Content switcher

The content switcher is used to toggle between two or more content sections within the same space on screen. It manipulates the content shown following an exclusive or “either/or” pattern.

White
Gray 10
Gray 90
Gray 100
Content switcher
Switch
Modifiers

General guidance

The content switcher is used to toggle between two or more content sections within the same space on screen. Only one section can be shown at a time.

Text

Be concise and specific. Titles have a max of two words.

Default selection

Based on usage, there should be a default selection. The default selection is always the first option in a switcher.

Content switcher vs. toggle

The content switcher is used for large groups of content, as opposed to the toggle which is meant for a “yes/no” or “on/off” binary decision.

content switcher example

Feedback

Help us improve this component by providing feedback, asking questions, and leaving any other comments on GitHub.