checkbox

registry:ui

checkboxes with ascii indicators

installation

npx shadcn@latest add https://asciicn.fldr.zip/r/checkbox.json

usage

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

export default function Example() {
  const [checked, setChecked] = useState(false);

  return (
    <Checkbox 
      checked={checked}
      onCheckedChange={setChecked}
      label="accept terms"
    />
  );
}

examples

basic

checked: no

text variant (default)

icon variant

disabled

without labels

props

Checkbox

prop
type
description
checked
boolean
whether the checkbox is checked
onCheckedChange
function
callback when checked state changes
label
string
optional label text
disabled
boolean
disable the checkbox
variant
string
"text" (default) or "icon" display style