INPUTS / COMPONENTS
Checkbox
Choose independent options.
About checkbox
Checkboxes are essential for user-friendly and efficient selection and interaction in the UI, simplifying decision-making and enhancing usability across applications, forms, and websites.
Anatomy
Shared parts, named consistently.
- 1Checkbox inputRequired
Selection control (input) that can be checked or unchecked, and pushed into different states.
- 2Checkmark iconRequired
Icon used to indicate checked state.
- 3Label
The label of the Checkbox.
- 4Minus iconRequired
Icon used to indicate the indeterminate state.
- 5Validation message
Message to add context to the error state.
Try the default
A working example with the shared V1 visual language.
When to use
Use for independent choices and multi-selection. Use a mixed parent state when only some children are selected.
Tab focuses; Space toggles. A native indeterminate state communicates mixed selection.