Radio Buttons

Our radio button components enable users to select a single option from a mutually exclusive set.

Interactive Radio Button Demo

Current Configuration: unselected state.

Radio Button States

Light Mode

Dark Mode

Radio Button Groups

Basic Group

Priority Selection

HIGH
MEDIUM
LOW
Advanced Usage

Status Selection with Descriptions

Currently being worked on

Waiting for approval

Task has been finished

Radio Button Specifications
StateBorder ColorBackgroundInner CircleSize
UnselectedBorderBackgroundNone20px
SelectedPrimary-500BackgroundPrimary-50020px
HoverPrimary-300Primary-50 / Primary-900None20px
DisabledNeutral-100Neutral-50 / Neutral-800None20px
Built with v0