Radio Group

Mutually exclusive selection within a group of options.

Preview & Interactive Laboratory

Usage & Implementation

<RadioGroup defaultValue="1">
  <RadioGroupItem value="1" id="r1" />
</RadioGroup>
React / Tailwind

Granular Customization

1

Group Container

The parent wrapper for all radio items.

className={`className`}
2

Radio Circle

The individual circular button.

className={`RadioGroupItem className='...'`}