Back to docs
Checkbox Design Patterns
A collection of accessible, production-ready checkbox recipes for forms, filters, and settings panels.
Standard Checkbox
The baseline pattern. Always pair with a label and use native input for keyboard and screen-reader support.
Checkbox Group
Use a fieldset with a legend for multi-select lists. Each option gets its own label.
Card Select
Replace the native box with a styled card. The hidden input preserves form semantics.
Toggle Switch
A checkbox styled as a toggle. Use for binary on/off states in settings.
Accessibility: Every pattern uses native <input type="checkbox"> paired with a label. No ARIA roles needed. Keyboard and screen-reader support comes free.