Radio
Radio button is a form control for making a single selection from a short list of options.
A radio button may not be used on its own: it must be rendered in a group of related radio buttons.
See the RadioGroup guidelines for usage examples.
Best practices
- A radio button may not be used on its own: it must be rendered in a group of related radio buttons using a RadioGroup.
- Radio buttons cannot be unchecked, so only use radio buttons when a selection is required
- An individual Radio should not have its own validation message or style. Instead, show a validation message on the RadioGroup. For more information, see the Validation Message section in the Forms documentation.
- An individual Radio button cannot be marked as required. Instead, make a selection required using the RadioGroup. For more information, see the Required field indicator in the Forms documentation.
React examples
Default
With a caption
This is a caption
With a leading visual
In a group of radio buttons
This example uses the RadioGroup component to render a set of radio inputs.
More code examples
See the Radio Storybook stories
Props
Loading data for radio...