Components/Switch

Switch

Boolean toggle control with three sizes and label support.

Installation

Examples

With label and description

Paired label and helper text.

Dark mode

Use dark theme across all pages

Sizes

sm, md (default), and lg.

sm
md
lg

States

On, off, and disabled.

On
Off
Disabled

API Reference

PropTypeDefaultDescription
checkedbooleanfalseControlled checked state.
onCheckedChange(v: boolean) => voidCalled when state changes.
size'sm'|'md'|'lg''md'Controls width and height.
disabledbooleanfalseDisables the switch.
labelReactNodeLabel beside the switch.