Image Color Picker

Pick any colour from an image and see its most common colours.

Click anywhere on a picture and read the exact colour as HEX, RGB and HSL. The tool also lists the most common colours in the image, which makes it a quick way to pull a palette from a photograph or a logo. Everything is done in your browser.

How to use it

  1. Choose or drop an image.
  2. Click or tap a point on the picture.
  3. Read the colour values.
  4. Copy the hex code, or click one of the common colours.

When it helps

  • Matching a brand colour from a logo.
  • Pulling a palette from a photograph.
  • Finding the exact colour in a screenshot.
  • Checking colour values in a design.

Good to know

  • Photos contain many shades, so click a few spots and compare.
  • The common colours are averages of similar shades, not exact pixels.
  • JPEG compression can slightly change colours near edges.

How the common colours are found

To build the palette, the tool shrinks your picture to a small copy, sorts each pixel into a bucket based on its red, green and blue values, and counts the buckets. The six busiest buckets, averaged, become the common colours. Transparent pixels are ignored.

That means a photo of a blue sky with a small red house will list blues first, and the red may not appear at all. If you want a specific small area, click it directly.

Worked example: matching a logo

Suppose a client sends a logo as a PNG and asks for the same colour on a website. Drop the PNG in, click the middle of the main coloured shape, and copy the hex code. Because logos use flat colours, one click gives the precise value.

For a screenshot of a page, click the element you care about. Screenshots are often exact, though compression and colour profiles can shift values slightly. If it matters, check against the brand's official guidelines.

Colour accuracy and next steps

Your screen's colour profile affects what you see, but the tool reads the pixel values, not how they look on your monitor. If you export a palette from a photo, consider checking contrast between colours before using them for text and backgrounds.

Once you've got a colour, the Color Converter turns it into other formats, and the Color Harmony Generator builds matching colours around it.

Using colours from images

Colours from photographs make natural palettes, because they come from scenes that already feel harmonious. Pick one dominant colour, one supporting colour and one accent from an image, then check their contrast before using them in a design.

Remember that screens, printers and image formats shift colours slightly, so important brand colours should come from the brand's official specification.

Questions

Is my image uploaded?

No, it stays in your browser.

Does it work on a phone?

Yes, tap a spot on the image.