Button Group

Button groups define how multiple buttons are arranged in a flow. Four orientations — vertical and horizontal, each with a normal and reversed variant — cover every layout pattern in Prizma flows.

Orientations

Vertical.btn-group--vertical

Stacked full-width buttons — the default on mobile verification flows. Primary on top.

Horizontal.btn-group--horizontal

Side-by-side pair for dialogs and wide layouts. Primary sits on the right.

Tokens

TokenRoleLayer

--scale-12Gap between buttons in a groupPrimitive

--btn-primary-surface-*All primary button tokensComponent

--btn-secondary-border-*All secondary button tokensComponent

--radius-buttonCorner radius on all buttonsSemantic

Component tokens

The color tokens for this component live in Color → Tokens, and its spacing, radius, and type map to the shared foundation scales.