Toggle Group
A set of two-state buttons that can be toggled on or off.
Single Selection
A toggle group that allows only one item to be selected at a time.
Multiple Selection
A toggle group that allows multiple items to be selected simultaneously.
Outline Variant
A toggle group with outline styling for a more subtle appearance.
With Labels
Toggle group items with both icons and text labels for better accessibility.
Disabled Items
Toggle group with some items disabled to show the disabled state.
Spacing
Toggle groups with different spacing values. Use the spacing prop to control the gap between items.
spacing=0 (default, connected)
spacing=1
spacing=2