Checkbox
Boolean input checkbox with error state support. Accessible, keyboard navigable, and supports controlled/uncontrolled modes. Built on Radix UI primitives.
Live Preview
Basic
Basic Checkbox
Simple checkbox with label and controlled state
Current state: Not accepted
States
Error State
Checkbox with error styling
Please check this box to continue
Disabled States
Checkboxes in disabled state
Indeterminate State
Checkbox in indeterminate state for partial selection
2 of 4 selected
Groups
Notification Preferences
Multiple related checkboxes for settings
Real World
Feature Selection
Checkboxes with descriptions for feature selection
Usage Guidance
✓ When to Use
Use for binary choices: agree to terms, enable features, select multiple items from a list, toggle settings. Essential for forms requiring yes/no or on/off selections.
✗ When NOT to Use
Don't use for single selection from multiple options (use Radio instead), toggle switches for settings (use Switch), or navigation/actions (use Button).
Props
errorclassNamestylechildrenonClickonChange