Find and refine a color
Enter any CSS color in the CSS color field, such as #663399, rgb(102,51,153) or rebeccapurple, or use the picker and the hue, saturation and lightness sliders. HEX, Alpha, RGB, HSL, HSV and CMYK update together, and you can edit any of them.
Search CSS color names
Type part of a name or hex code in Find by name or code to list matching CSS colors. With an empty search the tool shows the CSS names closest to your current color. Click a result to make it your color.
Build a palette
Pick a scheme: analogous, complementary, split complementary, triadic, tetradic or monochrome. Shades, tints and tones mix your color with black, white or gray in steps. Click a swatch to copy its HEX value, or copy the whole palette as CSS variables or JSON.
Keep your colors
Add your current color or a whole generated palette to My palette. Click a saved color to load it again. The list is stored in this browser only.
Check contrast
The contrast checker compares a text color with a background and shows the WCAG ratio. AA needs 4.5:1 for normal text and 3:1 for large text. AAA needs 7:1 and 4.5:1.
Frequently Asked Questions
Which color formats are supported?
HEX (with optional alpha), RGB, HSL, HSV and CMYK. The CSS color field also accepts any color name or function your browser understands.
Is CMYK exact?
No. CMYK is a simple conversion from RGB without a printer profile, so printed results can differ.
Where are my saved colors stored?
In your browser's local storage on this device. Nothing is uploaded.
Can I pick a color from an image?
Yes, use the Image Color Picker.