When to use radio buttons or select dropdowns?

Do you still remember the last time you were struggling to decide when to use a select dropdown or radio button on forms - sometimes it can be tricky!

Radio buttons and select dropdown are two essential input controls in forms. Both can be used interchangeably when input is required from the user.

This article is to provide you with some guidelines that can help you to decide which input control should be used in specific scenarios to make it easier for the user to input.

Select dropdowns are a last resort

Select dropdowns are implemented differently on various devices or browsers and are proven to be challenging to use for users with low digital literacy. In general, select dropdowns should be avoided where possible. Instead, you can consider using text inputs or radio buttons.

Have less than 6 options

When you have less than 6 options, using radio buttons is quicker for the user to scan the options and choose one, instead of opening a dropdown and select from multiple options.

Have 7 or more options

A select dropdown is recommended when there are more than 7 options available because the form becomes cluttered and long. However, if the user almost always needs to the change the value (the default is rarely right), then you may want radio buttons even if there are more than 7 options.

Comparison of options needs to be easy

When the scenario is that the user needs to compare the options before making a decision, radio buttons are the way to go. In general, it takes time to go through and compare the options in a select dropdown. User has to open the dropdown and compare options each time when she or he wants to review the selected option.

A large number of similar options are available

If a large number of similar options need to be displayed, a select dropdown is suitable because there is no need for the user to review or compare options side by side, and the user can predict them easily.