BETA This playbook is in BETA, we think it’s good enough to be useful right now, but there are gaps that need filling – your feedback will help us to improve it.

When to use this component

Use the radios component when users can only select one option from a list.

When not to use this component

Do not use the radio’s input if users might need to select more than one option. In this case, you should use the checkbox input.

How it works

Is this information correct?

Stacked radios

When there are more than 2 options or the options are longer than a single word. For example, Yes or No, radios should be stacked vertically, like this:

Is this information correct?

Things to remember

Order radio options alphabetically by default. In some cases, it can be helpful to order them from most-to-least common options, for example, Yes and No questions. But, you should be cautious about doing this as it can suggest bias in your service. If in doubt, order alphabetically.

Last reviewed: October 2, 2023 by Kailani

Next review due: April 2, 2024

Back to top