Checkbox

The Checkbox component is a control that allows users to toggle between checked and not checked states. It features bold borders and shadows that match the Things design system. Built from scratch using React and native HTML input elements. No dependencies on any UI library.

npx shadcn@latest add https://things.marvlock.dev/registry/ui/checkbox.json

import { Checkbox } from "@/components/ui/checkbox"
import { useState } from "react"

function MyComponent() {
  const [checked, setChecked] = useState(false)
  
  return (
    <Checkbox 
      checked={checked} 
      onChange={(e) => setChecked(e.target.checked)} 
    />
  )
}

Examples