Components
Checkbox
Checkbox is a wrapper for the native checkbox element.
Checkboxes provide users with a range of options for a given statement where the user may select any number of choices, including zero, one or multiple.
In a form, always place checkboxes underneath each other to aid in a user’s ability to scan the form. Checkboxes use the same keyboard workflow as the native checkbox element. The space bar is used to check/uncheck the input.
Guidelines
- Avoid checkboxes whose actions are the opposite of what the user expects.
- The default view for checkboxes has no option selected.
- Checkbox options should be listed in a logical order (alphabetical, numerical, time-based, etc).