Image Colour Picker

Pick colours from any image.

Free. Runs in your browser: nothing you enter or open is uploaded.

Colours are read from the image pixels in your browser. The dominant palette groups similar pixels with k-means clustering on a reduced copy of the image, so tiny details may not get their own swatch: pick those by hand. Photos taken in a wide colour space such as Display P3 are converted to standard sRGB values, which is what CSS hex codes mean.

How to use it

  1. Choose, drop or paste an image, such as a logo, a screenshot or a photo.
  2. Move over the image to see the colour under the loupe, and click or tap to add it to your picked colours.
  3. Copy any colour as HEX, RGB or HSL, or copy the dominant palette as CSS variables.

Questions

Why is the colour slightly different from the design file?

Images saved as JPG blur colours slightly, and screenshots can be colour managed by your system. For an exact brand colour, take it from the original design file or SVG rather than from a picture.

How is the dominant palette chosen?

The image is shrunk to about 25,000 pixels and similar colours are grouped into clusters. Each swatch is the average of one cluster, listed with its share of the image, largest first. Fully transparent pixels are ignored.

Can I pick colours from my screen?

Take a screenshot first, then paste it here with Ctrl+V or Command+V. Some browsers also offer an eyedropper on colour inputs that can pick from anywhere on screen.

Is my image uploaded?

No. It is drawn on a canvas in your browser and nothing is sent anywhere.