Patterns
Tweaks Panel
Floating panel (296px, bottom-right) that switches variant / theme / accent / glass / typography in real time. Persists to localStorage.
installnpx shadcn@latest add https://br-design-system2.vercel.app/r/br-tweaks-panel.json
Preview
Active state: variant A · light · subtle · #E74011
import { TweaksPanel, TweaksTrigger } from "@/components/br/tweaks-panel";
import { BRThemeProvider } from "@/components/br/theme-provider";
// in root layout
<BRThemeProvider>
{children}
<TweaksPanel />
<TweaksTrigger />
</BRThemeProvider>Props
| Prop | Type | Default | Description |
|---|---|---|---|
| — | — | — | No props. Reads/writes via useBRTheme(). |
Notes
- ⌘. toggle light/dark
- ⌘, cycle variant A→B→C
- ⌘/ toggle panel
- State persists to
localStorage['br-tweaks-v1']