Use a radio group to present a list of options where people must make a single selection.
Figma
The Figma reference for RadioGroup will appear here once the design link is added.
Storybook
Interactive examples for RadioGroup will render here once the Storybook link is wired in.
Best practices
- Always pair each option with an associated label.
- Offer at least two mutually exclusive choices — each option must be independent of the others.
- List options in a rational order that makes logical sense.
- Select a default option whenever possible.
Do’s and don’ts
Do
Start each label with a capital letter: “Option 1”.
Don’t
Lowercase labels or end a short label with punctuation: “option 1”, “Red;”.