What is an image color picker?
An image color picker lets you eyedrop an exact color out of any picture: upload an image, click a spot, and it shows that pixel’s HEX and RGB codes, plus it auto-extracts the image’s dominant palette. Everything runs locally in your browser — the image is never uploaded.
How to use
- Drag an image into the upload area, or click to choose a file.
- Click the spot you want on the image; the HEX and RGB appear on the right.
- The palette below lists the image’s main colors — click a swatch or button to copy the code.
Common use cases
- Pull brand colors out of a screenshot, logo or photo for design work.
- Match a reference image’s colors in your website or slides.
- Got the code? Turn it into HSL with the color converter, or build a gradient in the CSS generator.
Why doesn't the picked color match what you "see"?
You eyedrop a pixel out of a photo, drop the code into your design, and it looks slightly off. Usually the tool didn't misread it — a couple of easy-to-miss things are at play. First, JPG is lossy: it introduces faint noise around edges and gradients that your eye smooths over, so a single pixel's RGB can land on that noise — sample a few neighbours and you'll see the values jump around. To grab "the representative color of this area", the auto-extracted dominant palette below is steadier than poking one point, because it averages a whole region. Second, the screen's color profile (sRGB vs P3) and your design app's settings differ, so the same RGB can display differently. Eyedropping is best for getting an exact numeric starting point that you then fine-tune. Once you have the HEX / RGB, use the color converter for HSL or the CSS generator to build a gradient.