Components

Switch

Accessible toggle: the knob slides across the track on a snappy spring (layout animation) while the track crossfades to the accent.

Ambient motionMonthly digest

Install

Copies the component source — plus its small internal deps — into your project. You own the code from the first minute.

terminal

npx lumora-ui@latest add switch

Import

Using the workspace package instead? Deep imports keep cold starts lean; the barrel is fully tree-shakable either way.

app/page.tsx

import { Switch } from "@lumora/ui/components/switch";
// or from the barrel:
import { Switch } from "@lumora/ui";

Props worth knowing

Works controlled (checked + onCheckedChange) or uncontrolled (defaultChecked). Renders a real button with role=switch; Space and Enter toggle it, and the knob slides on the snap spring. Props extend the natural HTML element, so className, event handlers, and aria attributes pass straight through.