Command Palette

Search for a command to run...

Switch

shadcn/ui

A control that allows the user to toggle between checked and not checked.

import { Switch } from "@/registry/optics/switch";import { Label } from "@/registry/optics/label";<div className="flex items-center space-x-2">	<Switch id="airplane-mode" />	<Label htmlFor="airplane-mode">Airplane Mode</Label></div>

Installation

pnpm dlx shadcn@latest add https://optics.agusmayol.com.ar/r/switch.json

Props

<Switch />
Name
Type
className
string
variant
"raised" | "ghost" | "outline"
checked
boolean
defaultChecked
boolean
onCheckedChange
(checked: boolean) => void
disabled
boolean
required
boolean
name
string
value
string