How are the colours chosen?

The image is scaled down and its pixels are grouped into buckets of similar colour. The most frequent buckets become the palette, averaged for a clean hex value.

How many colours does it return?

Choose between three and twelve dominant colours. Fewer colours create a focused brand palette; more colours capture a complex photo.

Is my photo uploaded?

No. Sampling happens entirely in your browser using Canvas.

Does a dominant colour automatically have accessible contrast?

No. Frequency in an image does not guarantee readable text contrast. Test intended foreground and background pairs against WCAG contrast requirements before publishing.

Image Tools

Color Palette Extractor

Extract 3-12 distinct dominant colours with HEX, HSL, CSS, JSON and palette-image outputs.

Free browser toolRuns in your browserNo sign-up

Drop a photo here, or

Colours to extract: 8

Dominant colours are sampled locally and near-duplicates are suppressed. Verify accessibility contrast before publishing.

About the Color Palette Extractor

Design work often starts from a photo. This tool pulls the dominant colours out of any image so you can build a matching palette.

It samples the image in your browser, groups similar colours, suppresses near-duplicates and returns 3-12 dominant swatches with HEX and HSL values.

Your image is analysed locally and never uploaded.

Key features

Adjustable 3-12 colour extraction with duplicate suppression
HEX and HSL values with one-click copy
CSS-variable and JSON exports
Downloadable labelled palette PNG
Local, private processing

How to use

1Drop or choose an image.
2Choose between three and twelve colours, then review the extracted swatches and any near-duplicate suppression.
3Check text and background combinations with a contrast tool before using the palette in an accessible interface.
4Copy a colour, CSS variables or JSON, or download the palette PNG.

Examples

Palette from a photo

Input: sunset.jpg

Returns the main colours of the photo as copyable hex swatches.

Frequently asked questions

How are the colours chosen?: The image is scaled down and its pixels are grouped into buckets of similar colour. The most frequent buckets become the palette, averaged for a clean hex value.
How many colours does it return?: Choose between three and twelve dominant colours. Fewer colours create a focused brand palette; more colours capture a complex photo.
Is my photo uploaded?: No. Sampling happens entirely in your browser using Canvas.
Does a dominant colour automatically have accessible contrast?: No. Frequency in an image does not guarantee readable text contrast. Test intended foreground and background pairs against WCAG contrast requirements before publishing.

Open a related tool to prepare your files or refine the finished result.