// the find
jnsahaj/tweakcn
A visual no-code theme editor for shadcn/ui components
tweakcn is a visual theme editor for shadcn/ui that lets you tweak CSS variables, fonts, and shadows through a GUI instead of hand-editing config files. It targets frontend developers and designers who are building on shadcn/ui and want a distinct look without writing raw CSS. The AI-generate feature accepts a prompt or screenshot and produces a theme, which is the main differentiator over just editing CSS by hand.
Live preview with real shadcn component examples (dashboard, mail, cards) means you see exactly what your changes look like in context, not on synthetic swatches. The MCP server integration is a clever touch — it lets AI coding agents apply themes directly, bridging the gap between design tooling and agentic workflows. Export targets multiple formats (CSS variables, Tailwind v4 config) so you're not locked into one output shape. The community theme gallery gives you a starting point that isn't the default gray, which is the actual problem the README correctly names.
The AI generation is gated behind a paid tier, which means the one feature that distinguishes this from 'open devtools and change a CSS variable' costs money — the free tier is just a nicer UI for something you could do yourself. No export to Figma tokens or Style Dictionary, so if your team runs a design system that flows from Figma, this is a dead end. The editor is tightly coupled to shadcn/ui's specific token names; if you've customized or extended the token schema even slightly, you'll hit mismatches with no escape hatch. There's no versioning or diffing of saved themes, so if you iterate and want to roll back one change, you're doing it manually.