Skip to main content Skip to navigation Skip to search

The radio button is a form element comprising a series of items that make a list of options that allow the user to select options that are mutually exclusive of each other. Users may only select a single radio button within a series of items that make a list.


Use radio buttons when you want users to see all available multual exclusive options and the list of options is small.

Use radio buttons for six or fewer options.


Use a select box for more than six options, or a datalist for more than 13 options. Both prompt users to disclose the options.



Use when interactive and ready for input.


Use when not interactive. For example, when a user does not have permissions to edit the input.

Size required


Use to communicate a user or system error. This validation can happen when the user moves away from the input or after attempting to submit a form. For example, invalid input or username already taken.

Changes saved


Use to provide real-time feedback immediately after a user’s input. For example, username available.


Radio buttons are available in vertical, horizontal, and compact layout. See more layout guidelines on the form page.


message text

Vertical Inline

message text


message text

Horizontal Inline

message text


message text