Radio Button

An input for selection control that often appears when users are asked to make a decision, or select from the options presented to them.

What the component handles

Arrow key navigation between radio options within the group

Proper radio button semantics and grouping (role="radiogroup")

What you need to provide

Group label using the label prop to describe the question/choice

aria-labelledby if you’re referencing an existing label element

Color contrast

Meets the WCAG 2.1 AA color contrast ratio requirements and can be used on the following:

background.static.xxx tokens except for background.static.inverse and background.static.on-color

in default Card variant.