Radio Button

Single-selection input. Wrap RadioButton components in a RadioGroup, which manages shared state via context. Bind value on the group to track the selection.


Basic Usage

Bind value on RadioGroup to track the selected option.

Selected: light

Light Mode
Dark Mode
System Default

Selected: light

Light Mode
Dark Mode
System Default

Sizes

Set size on the group for a uniform size, or omit it to choose per-button sizes with compact / small.

Normal
Compact
Small

Variants

Set primary or accent on RadioGroup to change the color scheme. The default variant uses neutral tones.

Default

Option A
Option B
Option C

Primary

Option A
Option B
Option C

Accent

Option A
Option B
Option C