Theme Switcher
A theme switcher component for Next.js apps with next-themes and Tailwind CSS, supporting system, light, and dark modes.
Installation
Copy
1pnpm install next-themes lucide-react motion clsx tailwind-mergeUsage
Copy
1import { ThemeSwitcher } from "@/components/theme-switcher";Copy
1<ThemeSwitcher />References
- https://ui.shadcn.com/docs/registry
- https://ui.shadcn.com/docs/dark-mode/next
- https://github.com/pacocoursey/next-themes
- https://motion.dev/docs/react-motion-component
© 2025 Chánh Đang. All rights reserved.
Inspired by
&&
