WCAG: Calculating...
🎨 Color Harmonies
📌 Recent & Pinned Colors
How to use this color picker
1
Pick a color
Click anywhere on the spectrum or drag the hue slider to select any color.
2
Convert formats
HEX, RGB, HSL, and CMYK update instantly — edit any field to change the color.
3
Generate harmonies
Click complementary, analogous, triadic, tetradic, or monochromatic to see matching colors.
4
Save & export
Click any history swatch to restore a color, pin favorites, or copy HEX/RGB to clipboard.
Frequently Asked Questions
What's the difference between RGB, HEX, and HSL?
RGB represents colors as Red, Green, and Blue values (0-255). HEX is a hexadecimal shorthand of RGB (e.g., #FF5733). HSL represents Hue (color angle), Saturation (color intensity), and Lightness (brightness), which is often more intuitive for designers.
What are color harmonies?
Color harmonies are mathematically derived color combinations that are visually pleasing. Complementary colors sit opposite on the color wheel, analogous are adjacent, triadic are evenly spaced (120°), and tetradic form a rectangle.
Does this tool send my data to a server?
No. Everything runs entirely in your browser using JavaScript. Your color selections never leave your device and are never transmitted to any server.
What is WCAG contrast and why does it matter?
WCAG (Web Content Accessibility Guidelines) defines contrast ratios for text readability. AA requires 4.5:1 for normal text, AAA requires 7:1. Our tool instantly shows if your color meets accessibility standards.