WCAG Contrast Checker
| Swatch | White Text | AA | AAA | Black Text | AA | AAA |
|---|
Export Palette
Why Use This Palette Generator?
Color Theory Harmony
Choose from six harmony modes — complementary, analogous, triadic, split-complementary, monochromatic, or random — to create palettes grounded in proven color relationships.
WCAG Contrast Checker
Instantly see AA and AAA contrast ratings for white and black text on every swatch. Ship accessible designs with confidence.
Lock & Regenerate
Lock any colors you love and generate fresh palettes around them. Seed from a specific hex value for full creative control.
One-Click Export
Copy your palette as CSS custom properties, a Tailwind config object, SCSS variables, or a JSON array — ready to paste into your project.
Frequently Asked Questions
How does the color palette generator work?
It uses color theory harmony rules — complementary, analogous, triadic, split-complementary, and monochromatic — to generate 5-color palettes from a seed color or random starting point. Each mode applies a specific hue-angle formula to ensure visual coherence.
Can I lock specific colors and regenerate the rest?
Yes! Click the lock icon on any swatch to freeze it in place. Subsequent generation will preserve locked colors and build harmonious palettes around them.
How do I export my palette?
Click any export button to copy the palette as CSS custom properties, a Tailwind config object, SCSS variables, or a JSON array directly to your clipboard.
Get New Tools in Your Inbox
We ship free developer tools regularly. Drop your email to get notified.