On This Page
Production-grade theme controllers, sun/moon morphing switches, segmented pickers, and zero-flicker Next.js integration hooks. Fully interactive with live theme toggling.
Current state: dark
| Prop | Type | Default | Description |
|---|---|---|---|
| theme | "light" | "dark" | "system" | "dark" | Current active theme state. Can be controlled or bound to next-themes. |
| variant | "pill" | "icon" | "segmented" | "pill" | Visual appearance style of the theme switcher. |
| size | "sm" | "md" | "lg" | "md" | Dimensions profile for the toggle switch. |
| showLabel | boolean | false | Displays textual theme indicator label next to the control. |
| onChange | (theme: "light" | "dark" | "system") => void | undefined | Callback fired when the user selects or toggles a theme. |