0

Switch

PreviousNext

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

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

Installation

bunx --bun shadcn@latest add @ondo-ui/switch

Usage

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

Examples

Description

Focus is shared across devices, and turns off when you leave the app.

import {
  Field,
  FieldContent,

Choice Card

import {
  Field,
  FieldContent,

Disabled

import { Field, FieldLabel } from "@/components/ui/field"
import { Switch } from "@/components/ui/switch"

Invalid

You must accept the terms and conditions to continue.

import {
  Field,
  FieldContent,

Size

import { Field, FieldGroup, FieldLabel } from "@/components/ui/field"
import { Switch } from "@/components/ui/switch"

API reference

The component wraps Base UI Switch and accepts all of its props.