←back to thread

Show HN: Shadcn/UI theme editor – Design and share Shadcn themes

(shadcnthemer.com)
134 points miketromba | 1 comments | 25 Oct 25 19:51 UTC | HN request time: 0.212s | source

Hey, I built https://ShadcnThemer.com - a web app for creating and sharing themes for shadcn/ui, made with my some of my favorites, Next.js 15, Tailwind CSS 4, Drizzle ORM, and Supabase.

The goal was to make it easy to visually design shadcn color themes, preview them live across various example UIs, and export them straight into your projects (as CSS or via the shadcn CLI registry command).

I had a bit of experience going into this because I built the Theme Studio for VS Code in the past, but it was fun using a modern stack and leveraging Cursor to help me along the way this time.

GitHub: https://github.com/miketromba/shadcn-themer

Show context
jzig ◴[25 Oct 25 21:18 UTC] No.45707051[source]▶
The only changes I see are colors but what if I want eg a different border radius on buttons or margin on labels or specific fonts on elements etc? I don’t find changing only the colors of components particularly valuable but would like to see more variance in the actual shapes and looks of things.
replies(1): >>45707139 #
1. miketromba ◴[25 Oct 25 21:29 UTC] No.45707139[source]▶
Global border radius is editable, that setting is at the bottom of the sidebar. The challenge with global shadcn theming is that you're limited to adjusting the css variables they provide. I believe there is a global spacing variable, but it is not so specific that you can target e.g. just label spacing. That would be something you could modify directly within your shadcn input components via adjusting the tailwind class(es).