Toggle
Two-state pressable toggle button with variant and size styles.
Default
Controlled
State: off
Disabled
Disabled toggles can't be focused or pressed — the second one starts in its pressed state.
Sizes
sm
default
lg
Variants
default
outline
With Text
Installation
npx shadcn@latest add @byronwade/toggleProps
| Prop | Type | Default | Description |
|---|---|---|---|
| variant | "default" | "outline" | "default" | Visual style. |
| size | "default" | "sm" | "lg" | "default" | Button dimensions. |
| pressed | boolean | — | Controlled pressed state. |
| defaultPressed | boolean | — | Initial pressed state. |