Radio button

"Option button" redirects here. For the key in Apple keyboards, see Option key.

A radio button or option button^[1] is a graphical control element that allows the user to choose only one of a predefined set of mutually exclusive options.^[2] The singular property of a radio button makes it distinct from checkboxes, where the user can select and unselect any number of items.

Four options on a radio button. When a new option is chosen, the previously chosen option is unselected.

Radio buttons are arranged in groups of two or more and displayed on screen as, for example, a list of circular holes that can contain white space (for unselected) or a dot (for selected). Each radio button is normally accompanied by a label describing the choice that the radio button represents. The choices are mutually exclusive; when the user selects a radio button, any previously selected radio button in the same group becomes deselected (making it so only one can be selected). Selecting a radio button is done by clicking the mouse on (or touching the screen over) the button, or the caption, or by using a keyboard shortcut.

Etymology

A radio with a row of five pop-out buttons

Radio buttons are named after the physical buttons that were used on old radios to select preset stations.^[3][2] When one of the buttons is pressed, the other buttons pop out while leaving the pressed one pushed in.

HTML

In web forms, the HTML element <input type="radio"> is used to display a radio button. Example:

<form>
    <input type="radio" name="season" value="winter" id="winter" checked>
    <label for="winter">Winter</label>
    <input type="radio" name="season" value="spring" id="spring">
    <label for="spring">Spring</label>
    <input type="radio" name="season" value="summer" id="summer">
    <label for="summer">Summer</label>
    <input type="radio" name="season" value="autumn" id="autumn">
    <label for="autumn">Autumn</label>
</form>

A group of attributes is defined by name. In one group, only one radio button can be chosen.

Unicode

Version 6 of the Unicode standard includes a character designated to represent a radio button, (🔘) at code point 128,280 (U+1F518), found in the Miscellaneous Symbols and Pictographs section. Similar characters are the mathematical operator U+2299 ⊙ CIRCLED DOT OPERATOR as well as U+25C9 ◉ FISHEYE and U+25CE ◎ BULLSEYE.

The font Wingdings 2 contains at position 153 and 158 glyphs that look like radio buttons.

See also

• Checkbox