1

SwitchNew

A toggle switch with thumb travel animation and hidden checkbox for forms.

Interaction Type

Click to toggle. Thumb slides between on/off positions.

Props

Options you can pass to customize this component.

Prop
Type
Description
checked
boolean

Controlled checked state.

onCheckedChange
(checked: boolean) => void

Called on change.

label
string

Label text.

Installation

npx shadcn@latest addhttps://ui.nexvyn.dev/r/switch.json

How to use

<Switch checked={notifications} onCheckedChange={setNotifications} label="Notifications" />

Source Code

Click the code icon in the top-right corner to view the source code.

Contact

Questions or feedback? Reach out anytime.

License & Usage

  • •Free for personal and commercial use
  • •No attribution required
  • •Cannot be resold as a standalone product
  • •Anatomy/blueprint diagrams are licensed separately (CC BY-NC 4.0) and are not for commercial use
// No code loaded.
npx shadcn@latest addhttps://ui.nexvyn.dev/r/switch.json