nessra uinessra ui

A control that allows the user to toggle between on and off.

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

Installation

pnpmnpmyarnbun
pnpm dlx shadcn@latest add https://nessra-ui.vercel.app/r/switch.json

Usage

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

Examples

With Label

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

Disabled

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

API Reference

Switch

PropTypeDefaultDescription
checkedboolean-The controlled checked state
defaultCheckedboolean-The default checked state
onCheckedChange(checked: boolean) => void-Callback when checked changes
disabledbooleanfalseDisable the switch
requiredbooleanfalseMark as required
namestring-The name for form submission
valuestring"on"The value for form submission