What is a checkbox?

Checkbox — a graphical user interface (GUI) element that allows the user to select one or more options from a list.

Unlike radio buttons, where only one option can be selected from a group, checkboxes allow independent selection of each item.

Checkbox states:

• Unchecked / Cleared: The default state when the item is not selected.
• Checked / Selected: The state when the item is selected by the user.
• Indeterminate / Mixed: An intermediate state, used, for example, when a parent checkbox represents a group of child checkboxes, some of which are checked and others are not.

Visually, a checkbox is usually represented as a square, which can be empty (unchecked) or contain a checkmark/cross/filled square (checked). Next to it, there is a text label describing the item.

Examples of usage:

• Selecting additional options during software installation.
• Filtering data in tables or lists.
• Agreeing to terms of a user agreement (single checkbox).

In HTML, a checkbox is implemented with the <input> tag with type="checkbox":

<input type="checkbox" id="option1" name="options" value="value1">
<label for="option1">Option 1</label>

<input type="checkbox" id="option2" name="options" value="value2" checked>
<label for="option2">Option 2 (default selected)</label>

When testing checkboxes, the following are checked:

• Proper toggling of state (checked/unchecked) on click.
• Saving the state after form submission or page reload (if required).
• Correct transmission of selected values to the server.
• The label associated with the checkbox functions correctly (clickable label).
• Visibility and accessibility of the element.
• Default state (checked/unchecked).
• Proper display of the indeterminate state (if applicable).
• The effect of checking/unchecking on other interface elements (e.g., enabling/disabling a button).