When to use it

Use ToggleGroup when several toggles belong to one coordinated choice model. It is a strong fit for segmented controls, view switchers, and compact formatting or filtering toolbars.

Choose type="single" for one active option and type="multiple" when several options can stay pressed together.

Slot strategy

• ToggleGroup owns the selection model, shared sizing, and spacing.
• ToggleGroupItem represents one selectable value inside the set.

Each item needs a stable value. Keep the set small and easy to scan so the group still reads like one control rather than a wall of independent buttons.

Behavior and theming guidance

Keep item content short and consistent. Icons work well for dense toolbars, but icon-only items still need clear aria-label text.

Use shared variant and size values across the whole group so the options feel coordinated. Reach for spacing only when the set needs a looser layout than the default segmented treatment.