Free tool

Color palette extractor

Drop in an image and get its dominant colours as hex codes you can copy.

What this does

This reads an image and returns the colours it is actually made of, ranked by how much of the frame each one covers, with a hex code and a share of pixels next to each. It works by quantising the image into colour buckets and merging the ones close enough to read as the same colour, which is why it returns six distinct colours rather than six shades of the same blue. Useful in two directions: pulling a palette out of a brand's logo or a competitor's thumbnail so you can match it, and pulling one out of your own footage so an overlay sits in the same colour world as the shot behind it. The image is read in your browser and never uploaded.

How to extract a colour palette from an image

  1. 01

    Drop in an image

    A thumbnail, a logo, a screenshot, a frame from your footage. PNG, JPG, WebP and GIF all work, and nothing is uploaded.

  2. 02

    Choose how many colours

    Five or six is a palette. Ten is an inventory. The tool merges near-identical colours as it goes, so asking for more gives you more genuinely different colours rather than more shades of one.

  3. 03

    Copy what you need

    Click a swatch for its hex code, or copy the whole palette as a list. Take it into a brand kit, a thumbnail, or the colour fields of an animation.

Questions

How does it choose the colours?

It samples the image, sorts the pixels into colour buckets, and keeps the largest buckets after merging any that are too close together to read as different. That is why the result matches what your eye calls the image's colours rather than returning the mathematically most common pixel value, which on most photographs is a near-black.

Can I get the colours from a website or a video?

Screenshot the site and drop the screenshot in. For a video, grab a frame first — the frame grabber does that at full resolution — then extract from the still.

Does it handle transparent PNGs?

Yes. Fully transparent pixels are ignored rather than counted as white or black, so a logo on a transparent background returns the logo's colours instead of a palette dominated by the empty space around it.

What do the percentages mean?

The share of sampled pixels that fell into that colour's bucket. It tells you which colour is the image's ground and which is its accent, which is usually the thing you actually want to know.

Other free tools