Forms & selection@neumorphism-ui/switch

Switch

Applies role=switch to a native checkbox input to preserve form and browser behavior. Supports checked, defaultChecked, and onCheckedChange.

@neumorphism-ui/switch

Registry JSON

Preview

Live pricesRefresh market prices automatically.Email alertsReceive only important changes.Administrator policyThis setting is locked for the current workspace.

Installation

npx shadcn@latest add @neumorphism-ui/switch

The CLI resolves npm dependencies, base tokens, utilities, and component source in order.

New to this Registry? Set up the namespace before continuing.

Usage

npx shadcn@latest add @neumorphism-ui/switch @neumorphism-ui/label

Import

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

Example

<div className="flex items-center justify-between gap-4">
  <Label htmlFor="system-theme">Use system theme</Label>
  <Switch id="system-theme" name="systemTheme" defaultChecked />
</div>

API Reference

Component	Prop	Type	Default	Description
`Switch`	`checked / defaultChecked`	`boolean`	`—`	The controlled on state or initial uncontrolled state.
`Switch`	`onCheckedChange`	`(checked: boolean) => void`	`—`	Called when the on state changes.
`Switch`	`onChange`	`React.ChangeEventHandler<HTMLInputElement>`	`—`	Receives the native checkbox change event.
`Switch`	`disabled`	`boolean`	`false`	Disables input and pointer interaction.
`Switch`	`name / value / required`	`native input props`	`—`	Native checkbox attributes used for form submission.