Checkbox

FREE

Checkbox with an animated check, indeterminate state, and CheckboxField with label, description and card style.

Playground

Change the props and watch the component and its code update live.

Weekly digestNew components every Monday.

Props

Label

Description

Card

Primary color

Disabled

Code

import { CheckboxField } from "@/components/ui/checkbox";

<CheckboxField
  label="Weekly digest"
  description="New components every Monday."
/>

Terminal

npx @bloxa/cli add checkbox
# or: npx shadcn@latest add @bloxa/checkbox

Packages installed automatically: radix-ui

Weekly digestNew components every Monday.Product updatesSecurity alertsAlways on for owners.

The parent shows an indeterminate state while some children are checked.

Select all

ComponentsBlocksTemplates

EmailInvoices and receipts.SMSLogin codes only.

Every component also accepts the props of the element it renders.

Prop	Type	Default	Description
checked	boolean \| "indeterminate"	—	Controlled state.
onCheckedChange	(checked) => void	—	Called when the state changes.

Prop	Type	Default	Description
label	ReactNode	—	Clickable label.
description	ReactNode	—	Description under the label.
card	boolean	false	Renders the option as a card.