baseline grid

Check boxes

Default

Checkboxes are used for multiple choices, not for mutually exclusive choices. Each checkbox works independently from other checkboxes in the list, therefore checking an additional box does not affect any other selections. If a user can select only one option from a list, radio buttons should be used instead.
Border: #D0D2DA  |  Label text size: 12px (XS Paragraph)  |  Label text colour: #000000  |   Corner radius: 3px

:enabled

Checkbox item

:hover

Checkbox item

:focus

Checkbox item

:active

Checkbox item

:disabled

Checkbox item

Checkbox build:

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

Validation

Highlighting the component or input that a user hasn’t completed can help them to understand the problem and how to fix it.
Border: #D50000  |  Error text size: 12px  |  Error text colour: #D50000

Checkbox item