Color palette from image

Pull the colours out of a photo, a competitor's homepage, a mood board or a logo. Colours are grouped the way people perceive them, so near-identical shades merge and distinct ones stay apart, and each comes with its share of the image, ready to copy as HEX, RGB, HSL, CSS or Tailwind.

How colours are chosen

The image is sampled at 160 pixels on its long edge, and the pixels are grouped into the number of colours chosen using k-means clustering in OKLab, a colour space built to match human perception. Grouping in plain RGB tends to split one visible colour into two and merge two visible colours into one.

Each colour is the average of its group, and its percentage is the share of the image it covers. Transparent pixels are ignored, so a logo on a transparent background yields only the logo’s colours.

Questions

How do I get the HEX code of a colour in an image?

Add the image and choose the number of colours. Each colour card shows its HEX, RGB and HSL values; select a value to copy it.

Is my image uploaded?

No. The image is analysed in your browser and never leaves your device.

Why does the same image always give the same palette?

The clustering uses a fixed starting seed. Results are reproducible, so a palette shared with a colleague matches what they see.

How many colours should I extract?

Four to six for a brand or website palette: a dominant colour, a background, a text colour and one or two accents. Eight to ten for photographs and illustrations with more variety.

Can I use the palette in code?

Yes. Export it as CSS custom properties, a Tailwind colour scale or JSON, or download a PNG of the swatches for a presentation.

More free tools

View all

Bereit, die KI-Suche zu dominieren?

Jetzt loslegen

Allswap