About this tool
This free tool pulls a color palette out of any picture and gives you the codes you need to use it.
Upload or drag in a photo, choose 5 to 8 colors, and you get swatches with HEX, RGB and HSL values and a copy button for each one. Click the picture to use the eyedropper and read the exact color of any single pixel.
Your picture is never uploaded. The colors are calculated inside your browser with a deterministic median-cut method, so the same image always gives the same palette.
A second panel converts between HEX, RGB and HSL and shows the nearest CSS color name.
A third panel is a WCAG contrast checker that shows the contrast ratio and whether your text and background pass AA or AAA for normal and large text, with a live preview.
You can download the palette as a PNG strip or copy it as CSS variables for your stylesheet. Colors on screen can look slightly different on other displays, and a small photo may hide rare accent colors.
Contrast results follow the WCAG 2.x formula and are a guide for accessible design, not a legal certification.
How to use
- Choose a picture or drag it in, then pick how many colors you want (5 to 8).
- Copy any HEX, RGB or HSL code, or click the picture to pick one exact pixel.
- Convert codes or test text contrast below, then download the PNG strip or copy the CSS variables.