How are the colours chosen?

The image is sampled down and the pixels are grouped with median-cut quantisation, the same family of algorithm used for GIF palettes. Swatches are ordered by how much of the image they cover.

Why does the palette change when I ask for more colours?

More colours means the algorithm splits the pixel groups further, so broad colours separate into their lighter and darker parts.

Can I use this to match a brand colour?

Yes, for a close visual match. For an exact brand colour, always use the value from the brand guidelines — screenshots and photos shift colour through compression.

Image Colour Palette Extractor

Drop a photo, screenshot, or brand asset and get its dominant colours using median-cut quantisation. Each swatch shows its HEX value, RGB values, how much of the image it covers, and whether light or dark text reads better on it. Copy a single colour with one click, or copy the whole palette as CSS custom properties ready to paste into your stylesheet.

Drop an image to pull its colour palette

or click to browse — you can also paste with Ctrl/Cmd+V

PNG, JPG, WebP, GIF, AVIF, or SVG — nothing is uploaded

Your image is processed in this browser tab with the Canvas API. It is never uploaded, stored, or sent to a server.

How to Use Image Colour Palette Extractor

Drop an image, screenshot, or brand asset.
Choose how many colours you want, from 3 to 12.
Click any swatch to copy its HEX value.
Copy the whole palette as CSS variables.

Frequently Asked Questions

How are the colours chosen?: The image is sampled down and the pixels are grouped with median-cut quantisation, the same family of algorithm used for GIF palettes. Swatches are ordered by how much of the image they cover.
Why does the palette change when I ask for more colours?: More colours means the algorithm splits the pixel groups further, so broad colours separate into their lighter and darker parts.
Can I use this to match a brand colour?: Yes, for a close visual match. For an exact brand colour, always use the value from the brand guidelines — screenshots and photos shift colour through compression.

Related Tools

Image Resizer

Resize an image to any width and height in your browser. Free online image resizer with aspect-ratio lock, percentage presets, and PNG, JPG, or WebP output.

Image Compressor

Compress JPG, PNG, and WebP images in your browser. Set a target size in KB or pick a quality level and cut file size by up to 90%.

Image Converter (PNG, JPG, WebP)

Convert images between PNG, JPG, and WebP in your browser. Free bulk image converter — drop several files at once, no upload, no signup.

Image Cropper

Crop an image online with a draggable box and aspect-ratio presets for 1:1, 16:9, 4:5, and more. Free, browser-based, no upload.

About Image Colour Palette Extractor

Pull the dominant colours out of any image as HEX and RGB, with CSS variables you can copy. Free colour palette generator from a photo. This tool runs entirely in your browser, so your content is not sent to a server. MarkdownMe provides free, fast, and reliable Markdown tools for developers, writers, and anyone who works with Markdown.