Switch

Form

Toggles a binary setting on or off.

npx shadcn@latest add switch

Default

Preview

Live

Airplane mode

Dark mode

Locked

tsx

1<div className="flex items-center gap-3">
2  <Switch defaultChecked />
3  <Label>Airplane mode</Label>
4</div>

All props of the underlying Base UI primitive are forwarded. The table below documents the Shelf-specific props.

Prop	Type	Description
checked	boolean	Controlled checked state.
onCheckedChange	(checked: boolean) => void	Called when the switch toggles.
disabled	boolean	Prevents interaction.