Switch

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

Airplane Mode

import { Label } from "@/components/ui/label"
import { Switch } from "@/components/ui/switch"

export function SwitchDemo() {
  return (
    <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 switch

Usage

import { Switch } from "@/components/ui/switch"

<Switch />

Spinner Table

On This Page

Installation Usage

Deploy your shadcn/ui app on Vercel

Trusted by OpenAI, Sonos, Adobe, and more.

Vercel provides tools and infrastructure to deploy apps and features at scale.