Radio button

Also known as

Radio, Radio group

RadioButton and RadioButtonGroup represent a set of mutually exclusive but related options. The user can only select one radio button at a time. When a user selects a new option, the previously selected option automatically clears. Therefore, radio buttons should therefore be used to display a choice between two or more options, as it’s impossible to clear a single radio button after selecting it.

  • Tab moves focus to the checked radio button in the radio button group.
  • If the user hasn't checked a radio button, Tab moves focus to the first radio button in the group.
  • If the focused radio button isn't checked, Space changes the state to checked.
Up arrow / Down arrow / Left arrow / Right arrow
  • This action moves focus between the available radio button options, and simultaneously selects an option.