Status
Checkbox has different statuses depending on how they are used. This table shows all these variations:
|
|
Default The checkbox is available. |
Disable The checkbox is not available. |
|
Active It’s the checkbox default status. The checkbox is unchecked. |
|
|
|
Hover The user hovers over the checkbox with its mouse. |
|
|
|
Focused When a user checks a checkbox |
|
|
|
Indeterminate The list under this checkbox contains checked and unchecked checkboxes. |
|
|
Do / Don't
|
DO |
DON'T |
Align text label and checkbox at top right. |
Center the checkbox in relation to the text. |
|
|
|
|
DO |
DON'T |
Use the same color for selected items text label text than adjacent text. |
Use specific color for selected text label. |
|
|
|
|
DO |
DO |
DO |
If a checkbox’s parent are unchecked all its children checkboxes have the same status (unchecked). |
If not all but some child checkboxes are checked, parent checkbox take indeterminate status. |
If parent checkbox is checked, all the child checkboxes are checked. |