Components
Checkbox
A controlled checkbox with a check indicator.
Checkbox is built on the Base UI Checkbox primitive. It supports controlled and uncontrolled usage through checked and onCheckedChange.
Installation
pnpm dlx shadcn@latest add https://faber-ui.vercel.app/r/checkbox.jsonUsage
"use client";
import { Checkbox } from "@/components/ui/checkbox";
export default function Example() {
return <Checkbox />;
}Examples
Default
With a label
import { Checkbox } from "@/components/ui/checkbox";
import { Label } from "@/components/ui/label";
export default function Example() {
return (
<div className="flex items-center gap-2">
<Checkbox id="terms" />
<Label htmlFor="terms">Accept terms</Label>
</div>
);
}API
The Checkbox accepts all Checkbox.Root props from @base-ui/react/checkbox, including checked, defaultChecked, and onCheckedChange.
Changelog
Full Checkbox historyLast updated on