Toggle a checkbox or a switch

At a glanceCopy Anchor Link

• Who: Form builders collecting booleans and on/off settings.
• What: Accessible checkbox and switch toggles.
• Use when: Checkbox for agreements and multi-picks, switch for instant on/off settings.
• Avoid when: For exclusive choices — use Select or radio inputs instead.
• See also: Pick one option from a dropdown

PreviewCopy Anchor Link

InstallCopy Anchor Link

pnpm add @zedtech/zedkit-ui

Latest: 0.3.0 (via changesets).

ExampleCopy Anchor Link

import { Checkbox, Label, Switch } from "@zedtech/zedkit-ui";
<Checkbox id="terms" />
<Label htmlFor="terms">Accept the terms</Label>
<Switch id="notify" aria-label="Notify me" />

Wraps: @radix-ui/react-checkbox, @radix-ui/react-switch