Checkbox
Checkboxes allow the selection of multiple options from a set
Table of Contents
Edit this section, Opens in new windowOverview
Checkboxes are used when there are lists of options and the user may select any number of choices, including zero, one, or several. In other words, each checkbox is independent of all other checkboxes in the list, so checking one box doesn’t uncheck the others. A stand-alone checkbox, or a toggle can be used for a single option that the user can turn on or off.
Usage
Always use clear and concise labels for checkboxes. Be explicit about the action that will follow if the Checkbox is selected. Labels appear to the right of checkboxes.
Click targetUsers should be able to select the checkbox by clicking on the box directly or by clicking on its label.
Default selectionThe default view of a set of checkboxes is having no option selected.
Sizing
With given attributes (data-size), you can vary the size of the checkbox.
Behaviours
States
Anatomy
- Legend (optional)
- Vertical checkboxes
- Clear and short label
- Legend (optional)
- Horizontal checkboxes
- Clear and short label