From W3C Wiki


A checkbox is an input option that represents a setting or value with an on, off, or mixed choice. A check mark within the checkbox indicates that the setting is selected or checked.

Checkboxes in a group are non-exclusive options; more than one checkbox in a group can be checked at any given time.

Keyboard Interaction

When focus is on a checkbox, the Spacebar key toggles the selection, checking or unchecking the box.

Mouse Interaction

Clicking on a checkbox with the primary mouse button toggles its selection.


  • Checkboxes are typically represented as squares with a check mark inside when checked.
  • If the checkbox is in an indetermined state, its appearance will resemble a disabled state.

ARIA Roles and Properties

  • A two-state checkbox uses the role checkbox.
  • A checkbox that also supports a mixed state uses the role checkboxtristate.
  • Checkboxes can have these states:
    • Checked - aaa:checked="true"
    • Unchecked - aaa:checked="false"
    • Mixed or tristate - aaa:checked="mixed"
  • They may have the properties aaa:describedby and aaa:labeledby; see ARIA Relationships.

See also the tristate example in the Roles document.


Checkbox with title for accessible name