Thilo

Patterns

Pattern	Preview	Usage
Segmented control		Time ranges, view modes, tabs
Icon group		Text formatting toolbars
With text label	Sort:	Sort controls, labeled segmented buttons
Split button		Primary action + dropdown for alternatives
Mixed sizes		Action + expand in one unit

Sizes

Large (lg)

Default

Small (sm)

In context — view switcher + formatting toolbar

Tickets

View switcher — icon group in the toolbar

Text formatting toolbar — two ghost button groups separated by a divider

Sub-components

Component	Role
ButtonGroup	Wrapper — removes inner border radii, groups buttons visually
ButtonGroupSeparator	Thin vertical divider between button sections
ButtonGroupText	Non-interactive label attached to the left of the group

Use Button inside — any variant and size work. ButtonGroup only handles layout, not selection state.

Button Group