Radio Group

Use GdsRadioGroup when users need to pick exactly one option from a short list. Render a GdsRadio for each option, and wrap the group in GdsFormControl with a GdsFormLabel so screen readers announce what the group is for.

Usage

With helper text

Use GdsFormHelperText when the group needs supporting guidance. Link it to the group with aria-describedby so assistive technology announces the helper text with the radio options.

Horizontal layout

Pass row on GdsRadioGroup to lay options out horizontally. Useful for short option labels (yes/no, on/off).

Radio colors

GDS supports default, primary, and error radio colors.

Only the selected radio uses the chosen color. Unchecked radios stay on the default gray color.

Radio sizes

GDS supports MUI’s native medium and small radio sizes.

Radio states

Radio examples should be labeled so users can understand the state being shown.

Props