# Radio group

Choose one of two to five visible options. The same `.cb` input on a circle; radio cards for options that need a description.

- **Group:** Form controls · **family:** `form-controls` · **shadcn:** RadioGroup
- **Build:** shadcn `RadioGroup`.
- **In apps/admin today:** Not in apps/admin.
- **Client component:** yes. 

## Content rules

- Options are parallel nouns or short phrases.

## Do

- Preselect the safe default.

## Don't

- More than five options: use Select.

## Accessibility

- **Keyboard:** Tab enters the group at the checked option; ↑ ↓ ← → move and select.
- **ARIA:** Radix `RadioGroup` (`role="radiogroup"` with an `aria-labelledby`).
- **Focus:** Ring on the focused radio.

## Tokens

`--background` `--primary` `--focus-ring` `--muted-foreground` `--s-3` `--s-6` `--s-4` `--input` `--r-card` `--motion-hover` `--motion-focus` `--w-semibold` `--text-card` `--font-voice` `--text-small`

## Files

`radio.html` live specimen · `radio.css` kit rules · `radio.d.ts` props · full page: `docs/components/radio/` (phone: `m/`).