KQ-033 · PHASE/SWITCH

Phase Switch

Day to night in one clean sweep — a framework-agnostic theme toggle that reveals the new theme as a circle growing from the button, via the View Transitions API.

KQ-033 · PHASE/SWITCH

Observation deck

Day shift
EXPOSURE1/125 s
APERTUREf/5.6
SKY GLOW-42 dBm

Wired to this card only — your app flips its real theme class.

Install

One command — the source lands in your repo. Or copy it from the Code tab.

$ pnpm dlx shadcn@latest add @kinetiq/phase-switch

Props

PropTypeDefaultDescription
checked / onCheckedChangeboolean / (next) => voidControlled only — flip your own theme class inside the callback; the component owns zero theme logic.
size / label"sm" | "md" | "lg" / string"md" / "Toggle theme"Control size and accessible name.