Checkbox

A checkbox allows users to select or deselect a predefined option independently. It can also be applied to create an on/off switch.

Accessibility Features

  • type="checkbox" provides the checkbox role and behaviour as well as communicates the checked state.

Checkbox

Example

Code Snippet

Switch

A switch is a binary toggle that turns a setting on or off and shares the same underlying input element as a checkbox. role="switch" overrides the implicit checkbox role to communicate this on/off nature to screen readers. The native checkbox is visually hidden but remains in the accessibility tree so focus and state are handled by the browser.

Example

Code Snippet