8bit

Search docs

Search for a docs page

Checkbox

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

shadcn/ui docs

Installation

pnpm dlx shadcn@latest add https://8bit.cnlibs.com/r/checkbox.json

Usage

import { Checkbox } from "@/components/ui/checkbox";
import { Label } from "@/components/ui/label";
<div className="flex items-center gap-2">
  <Checkbox defaultChecked id="terms" />
  <Label htmlFor="terms">Accept terms and conditions</Label>
</div>

Disabled

Set disabled to prevent the checkbox from being toggled.