Checkbox

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

Accept terms and conditions

Installation

npx shadcn@latest add https://reactdocs.canceydejean.dev/r/checkbox.json

Usage

Use checkboxes for multi-select options, settings, and form field toggles.

import { Checkbox } from "@/components/checkbox/checkbox";

export function Example() {
  return (
    <div className="flex items-center gap-2">
      <Checkbox id="terms" />
      <label htmlFor="terms">Accept terms and conditions</label>
    </div>
  );
}

Supports controlled/uncontrolled checked state, disabled, and aria-invalid styling for form errors. Built on Base UI Checkbox.