CheckboxNew

A checkbox with drawn check animation, indeterminate state, and hidden native input for forms.

Dependencies

motion

Interaction Type

Click to toggle. Supports checked, unchecked, and indeterminate states.

Props

Options you can pass to customize this component.

Prop
Type
Description
checked
boolean

Controlled checked state.

onCheckedChange
(checked: boolean) => void

Called on change.

label
string

Label text.

indeterminate
boolean

Show indeterminate state.

strikeThrough
boolean

Draws a line through the label when checked, to-do-list style.

Installation

npx shadcn@latest addhttps://ui.nexvyn.dev/r/checkbox.json

How to use

<Checkbox label="Accept terms" checked={checked} onCheckedChange={setChecked} />

Source Code

Click the code icon in the top-right corner to view the source code.

Contact

Questions or feedback? Reach out anytime.

License & Usage

  • Free for personal and commercial use
  • No attribution required
  • Cannot be resold as a standalone product
  • Anatomy/blueprint diagrams are licensed separately (CC BY-NC 4.0) and are not for commercial use
// No code loaded.
npx shadcn@latest addhttps://ui.nexvyn.dev/r/checkbox.json