Checkbox
Toggle an independent option, with support for mixed and disabled states.
Preview
Import
import { Checkbox } from "@sigil-ui/components";Usage
<div className="flex flex-col gap-3">
<Checkbox label="Subscribe to product updates" defaultChecked />
<Checkbox label="Send weekly digest" />
<Checkbox label="Beta features" disabled />
</div>Props
| Prop | Type | Default | Description |
|---|---|---|---|
label | string | — | Readable label for the component. |
Token integration
| CSS Variable | Purpose |
|---|---|
--s-border-style | Border style |
--s-border | Border |
--s-background | Background |
--s-radius-sm | Radius sm |
--s-duration-fast | Duration fast |
--s-primary | Primary |
--s-primary-contrast | Primary contrast |
--s-ring | Ring |
--s-ring-offset | Ring offset |
--s-text | Text |