Radio Buttons

Overview

Radio buttons are common form controls that allow users to select one item from a list of options.

Textbox module not selected or not found. Textbox module not selected or not found.

How to Use

When to Use

  • Users only need to select one item from a list of options and need to see all available options at a glance.

When to Consider Something Else

  • Your form has many fields and you want to limit the amount of vertical space used by these fields, a Dropdown is a good alternative.
  • Users need to select any number of options from a list. Checkboxes are appropriate in these cases.
  • You need to display a “toggle” option like “Yes” and “No” or “On” and “Off”. A single Checkbox is appropriate in this case.

Other Guidance

Options Text: Be concise – one or two words.

Multiple Columns: Radio buttons may be displayed in multiple columns. This format is best when the options text is very short. Consider how much text wrapping may occur when using multiple columns. Like other lists in the RD Templates, radio buttons formatted in multiple columns will only display as a single column in Viewport 1.

Textbox module not selected or not found. Textbox module not selected or not found.

Big Radio Button Option: A larger checkbox style is available for sites using the RD Templates and need to support mobile devices users. When the big checkbox class is applied to a group of checkboxes these will automatically display larger in Viewport 2 and Viewport 1 to improve the user experience on mobile phones.

Textbox module not selected or not found. Textbox module not selected or not found.

References