Theme System
Theme provider + switcher wired for tweakcn token sets with local persistence.
Quickstart
- Ensure the registry is set up in Installation.
- Run the registry command:
npx shadcn@latest add https://gen-ui-eta-two.vercel.app/r/theme-systemUsage
import { ThemeProvider, ThemeSwitcher } from "@/components/systems/theme/theme-system"
export function AppShell({ children }) {
return (
<ThemeProvider defaultTheme="system">
<header className="flex items-center justify-between">
<h1 className="text-lg font-semibold">GenUI</h1>
<ThemeSwitcher />
</header>
{children}
</ThemeProvider>
)
}API Reference
| Prop | Type | Notes |
|---|---|---|
| ThemeProvider | component | Theme context + body token wiring |
| ThemeSwitcher | component | Dropdown to switch themes |
| ThemeName | type | system | light | dark | paper | paper-dark | orchid | orchid-dark |