← All patterns · Input widgets

Radio group

Set of mutually-exclusive choices.

Pattern

A radio group presents two or more options of which exactly one is selected. The group itself takes a single Tab stop; arrow keys move between options.

Roles

  • radiogroup
  • radio

States and properties

aria-checked
On each radio; true on the selected one.
aria-labelledby
On the radiogroup, pointing at its label.

Keyboard interaction

Up / Down or Left / Right arrow
Move focus and selection.
Space
Select focused radio (if not auto-selected).

WCAG criteria

  • 2.1.1 — Keyboard

Canonical reference

WAI-ARIA Authoring Practices Guide — Radio group

More