Checkbox
A component for displaying checkboxes.
Usage Examples
Basic Usage
Use the Checkbox component for multiple selections
<Checkbox onCheckedChange={(checked) => console.log(checked)} />
With Label
Combine with label for better accessibility
<div className="flex items-center space-x-2">
<Checkbox id="terms" />
<Label htmlFor="terms">Accept terms and conditions</Label>
</div>
Props
Name
Type
Default
Description
checked
boolean
-
The controlled checked state
defaultChecked
boolean
false
The default checked state
onCheckedChange
(checked: boolean) => void
-
Called when the checked state changes