Command Palette

Search for a command to run...

Checkbox

shadcn/ui

A control that allows the user to toggle between checked and not checked.

import { Checkbox } from "@/registry/optics/checkbox";import { Label } from "@/registry/optics/label";<div className="flex items-center space-x-2">	<Checkbox id="terms" />	<Label htmlFor="terms">Accept terms and conditions</Label></div>

Installation

pnpm dlx shadcn@latest add https://optics.agusmayol.com.ar/r/checkbox.json

Props

<Checkbox />
Name
Type
className
string
variant
"black" | "raised" | "ghost" | "outline"
variantChecked
"black" | "raised" | "ghost" | "outline"
variantUnchecked
"black" | "raised" | "ghost" | "outline"
checked
boolean
defaultChecked
boolean
onCheckedChange
(checked: boolean) => void
disabled
boolean
required
boolean
name
string
value
string