A toggle control styled as a sliding switch for turning settings or features on and off.

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

export default function SwitchDemo() {
  return (
    <div className="flex items-center gap-2">
      <Switch id="airplane-mode" />
      <Label htmlFor="airplane-mode">Notifications</Label>
    </div>
  );
}

Installation

Usage

import { Switch } from "@/components/ui/switch";
<Switch />