Checkboxes

[thibautsailly]

Design and document checkboxes.

[thibautsailly]

Existing specifications for checkboxes:

• Gov.uk design system
• USWDS
• IBM's Carbon design system
• GitHub's Primer design system

[thibautsailly]

Here are the various facets to be covered by design and specifications.

Size

• [x] regular
• [x] small

Layout

• [x] single
• [x] group
• [x] nested or not
• [x] single or multiple lines label

Anatomy

• [x] box
• [x] label
• [x] tag
• [x] hint
• [x] group label
• [x] required input
• [x] group caption
• [x] form validation icon
• [x] form validation label

Interactivity

• [x] rest
• [x] hover
• [x] pressed
• [x] focus
• [x] read-only
• [x] disabled

User input

• [x] unchecked
• [x] checked
• [x] indeterminate

Form validation

• [x] warning, with or without message
• [x] error, with or without message

[thibautsailly]

Should we highlight required inputs, and if so, how should they be highlighted: https://www.nngroup.com/articles/required-fields/