Pick, build and check colors for design and code.
Grab an exact shade with the Image Color Picker, build a scheme on the Color Wheel or blend one with the Gradient Generator.
Before you ship it, make sure text stays readable with the Contrast Checker.
Nothing here matches "".
Our tool shelf is big, though. Try the site search or .
These tools cover the whole color workflow: find a color, build a scheme around it, turn it into code and check it is accessible. They give you values ready to paste into CSS, Figma or your brand guide.
Exact colors from any image
AI palettes and color harmonies
CSS code, PNG or SVG export
WCAG AA and AAA contrast checks
| Format | Example | Good for |
|---|---|---|
| HEX | #3399CC | CSS, design apps, brand guides |
| RGB | rgb(51, 153, 204) | Screens, CSS with transparency (rgba) |
| HSL | hsl(200, 60%, 50%) | Making lighter or darker shades by hand |
| Named | steelblue | Quick prototypes |
Convert between all of them in the CSS Color Editor. Want to swap a color inside a picture? Use the Image Color Replacer.
Open the Image Color Picker, upload or paste your image and click anywhere. You get the exact color in HEX, RGB and HSL, ready to copy.
The AI Color Palette tool builds a matching palette from an image. For classic schemes such as complementary or triadic, use the Color Wheel.
Use the Gradient Generator. Add color stops, pick linear or radial, then copy the CSS or download the gradient as PNG or SVG.
Enter your text and background colors in the Contrast Checker. It shows the contrast ratio and whether it passes WCAG AA and AAA for normal and large text.
Yes. The CSS Color Editor converts between HEX, RGB, HSL and named CSS colors, and lets you adjust each value live.
WCAG AA asks for at least 4.5:1 for normal text and 3:1 for large text. AAA raises that to 7:1 and 4.5:1.
Yes - the Image Color Replacer swaps one color for another across an image, with a tolerance control for similar shades.
Most color tools work entirely in your browser, so your images stay on your device. The AI Color Palette sends the image to our server for analysis and deletes it automatically after a few hours.