What is a radio button in UX design?
A radio button is a circular form control used in groups where users must select exactly one option from a set of mutually exclusive alternatives. When one radio button in a group is selected, all others in the same group are automatically deselected, enforcing single selection. The name references physical car radios where pressing one station button caused all others to pop out. Radio buttons are used for preference selections, mode choices, and any form field where exactly one option from a defined set must be chosen.
When should you use radio buttons?
Radio buttons are appropriate when there are two to six mutually exclusive options that users should see simultaneously to make their selection, when the options require comparison before choosing, and when all available options should be visible rather than hidden behind a dropdown. Fewer than two options should use a toggle switch or checkbox. More than six options typically benefit from a dropdown to save space. Radio buttons work well for selecting a shipping speed when users need to see all speeds and prices simultaneously to make a cost-informed decision, but work poorly for selecting a country from a list of 200.
What are the most common radio button design mistakes?
Pre-selecting a default radio button option removes the requirement for users to make an active choice, but can cause unintended selections if users do not notice the pre-selection. Not pre-selecting any option forces an explicit choice but leaves the form in an invalid state until the user selects something. Placing radio buttons far from their labels makes the association unclear and creates small touch targets. Using radio buttons for multi-select scenarios where checkboxes are correct creates fundamental interaction model confusion. Arranging radio buttons horizontally rather than vertically makes them harder to scan because the labels and controls alternate rather than aligning in a column.