defuss-shadcn / Guides / Theming / theme-designer

Design your own theme, the way tweakcn does - right here. Start from any theme, change colours for light and dark, pick Google Fonts, set the radius and the shadows: the whole site follows as you go. The preview on the right is part of the editor: click a colour to change it, and the Forms & Inputs card holds the roundness, font, letter-spacing and shadow controls. Its tabs show every component at once, or one of the six example apps (Admin Dashboard, Messenger, Issue Tracker, Notes & Docs, Status Page, Desktop) in your theme. Your unsaved draft stays on while you browse the other pages, so you can check every component in it before you save (the theme menu can pause or discard it). Save it by name - it stays in this browser and shows up on top of the theme menu - or export the CSS for your own project (Theming explains the tokens).