Shadcn Themer is a web application that allows you to create, customize, and share themes for shadcn/ui. Build beautiful color schemes with real-time previews, export them for use in your projects, and discover themes created by the community.
Visit shadcnthemer.com to try it out!
- 🎨 Visual Theme Editor - Intuitive color picker with OKLCH color space support
- 👁️ Live Previews - See your changes instantly across multiple UI components
- 🌓 Light/Dark Mode - Design and preview themes in both modes simultaneously
- 📦 Export Options - Export as CSS or via shadcn CLI registry format
- 📥 Import Themes - Import existing themes from CSS
- 🔀 Fork Themes - Build upon themes created by the community
- ⭐ Star System - Save and favorite your preferred themes
- 🔤 Font Customization - Choose from Google Fonts with live preview
- 📐 Border Radius Control - Customize component roundness
- 👤 User Profiles - Showcase your theme collection
- 🎯 Color Filtering - Browse themes by primary color
- Framework: Next.js 15 (App Router)
- Language: TypeScript
- Styling: Tailwind CSS 4
- UI Components: shadcn/ui
- Database: PostgreSQL with Drizzle ORM
- Authentication: Supabase Auth
- Storage: Supabase Storage
- API: Hono with RPC pattern
- State Management: TanStack Query
- Color Handling: Color.js
- Icons: Lucide React
- Package Manager: pnpm
- 🐛 Found a bug? Open an issue
- 💡 Have a feature request? Start a discussion
Built by Mike Tromba