The checkbox option provides the user with clear option to chose from in a short list. They are primarily used in forms.



Anatomy
Checkbox Option (Row)
- Checkbox 24x24px
- Left align 16px IBM Plex Sans Regular
- 12px, 12px, 12px, 0px padding
- 12px space
- 480px width
Checkbox Option (Row & Graphic)
- Checkbox 24x24px
- Icon 32x32px
- Left align 16px IBM Plex Sans Regular
- 8px, 12px, 8px, 12px padding
- Space 12px
- Space 12px
- 480px width
Checkbox (Column)
- 24px, 12px, 24px, 12px padding
- Icon 32x32px
- Space 8px
- Centre align 16px IBM Plex Sans Regular
- Space 8px
- Checkbox 24x24px
- 171px width
States
Row - DefaultRow - ActiveRow - InactiveRow & Graphic - DefaultRow & Graphic - ActiveRow & Graphic - InactiveColumn - DefaultColumn - ActiveColumn - Inactive