Custom Colors is a professional palette and design-token workspace for designers and developers. Create and fine-tune palettes with drag-and-drop controls, check WCAG and APCA contrast in real time, generate harmonious variations, and preview colors in real UI components. Export to CSS, JSON, Tailwind, DTCG, SVG, or PNG, organize palettes into projects and collections, and share any palette with a single link.

Hey Product Hunt, I built Custom Colors because creating a great color palette often meant jumping between multiple tools - one for inspiration, another for accessibility checks, and another for exporting design tokens. As a frontend engineer, I wanted a single workspace where designers and developers could create, refine, test, preview, organize, and export production-ready color systems. With Custom Colors, you can: 🎨 Build and customize palettes visually ♿ Check WCAG and APCA contrast in real time ✨ Generate complementary, analogous, triadic, and monochromatic variations 🧩 Preview colors across real interface components 📦 Export to CSS, JSON, Tailwind, DTCG, SVG, and PNG 🔗 Organize palettes into projects and share them through a link This is an early version, and I would genuinely appreciate your feedback. What would make Custom Colors more useful in your design or development workflow?

the APCA contrast check on top of the usual WCAG is a nice move, most tools still treat it like a footnote. love that you can preview colors inside real UI components before exporting.

@serdarkoar9biz Thanks Serdar, really appreciate you noticing those details.

the APCA contrast check on top of the usual WCAG is a nice move, most tools still treat it like a footnote. love that you can preview colors inside real UI components before exporting.

@serdarkoar9biz Thanks Serdar, really appreciate you noticing those details.

Custom Colors

Build accessible color palettes and export design tokens

Build accessible color palettes and export design tokens