Codxing

Palette Extractor

Pull the dominant colours out of any photo as hex codes.

Loading tool…

About Palette Extractor

Palette Extractor pulls the dominant colours out of any image as hex codes, sized by how much of the picture each one covers. Useful for building a brand palette from a logo, matching a website to a photograph, or lifting a colour scheme from a poster you like. Colours are found by bucketing pixels and averaging the largest groups, so results are stable rather than picking random pixels.

How to use it

  1. Drop in an image.
  2. Choose how many colours to pull, between 3 and 12.
  3. Click Extract palette, then click any swatch to copy its hex code.

Questions

Why are the colours duller than the image looks?

Each swatch is the average of a group of similar pixels, which pulls towards the middle. Vivid highlights occupy few pixels, so they rarely become dominant colours.

How many colours should I extract?

Five or six for a usable palette. More than eight and you get near-duplicates that are hard to tell apart in a design.

Can I use these straight in CSS?

Yes — copy all of them and the Design Hub’s Colour Converter will give you a full tint and shade ramp from any one.

Palette Extractor is free and runs entirely in your browser. No account, no upload, no watermark, no limit on use.

More in Extract