Skip to content

Extract Color Palette From Image

Pull the dominant colours out of any photo.

Drop an image here, or click to choose one

JPEG, PNG, WebP, GIF or SVG · processed on your device, never uploaded

Quick Tool Overview

Extract Color Palette From Image pulls the dominant colours out of a photo using median-cut quantisation, which finds genuinely distinct colours rather than five shades of the same sky. Each swatch carries its share of the image, all four colour formats, and a contrast check, and the palette exports as CSS, Tailwind, JSON or a swatch image.

What it does
Builds a colour palette from a photograph
You give it
An image and a colour count
You get back
A palette with export-ready code
Best for
Brand colours, themes and design systems
Image Tools Free, unlimited use No sign-up Runs in your browser

About the Extract Color Palette From Image

Building a palette from a photograph is how brand colours, presentation themes and interface schemes usually start, because a real image already contains colours that work together.

The extraction uses median-cut quantisation, which splits the colour cube where the image actually has variety rather than simply counting the most common pixels — that distinction matters, because counting gives you five shades of the same sky. Each colour comes with its share of the image, its HEX, RGB and HSL, and a contrast check against black and white. The palette exports as CSS custom properties, a Tailwind colour block, JSON, or a swatch image.

Key features of the Extract Color Palette From Image

Median-cut, not counting

Splits the colour cube where the image has variety, so the palette is distinct colours rather than near-duplicates.

Contrast flags

Each swatch shows whether black or white text passes WCAG AA on it, which decides what the colour can be used for.

Share of the image

How much of the frame each colour occupies, which tells you which is the primary and which the accent.

Four export formats

CSS custom properties, a Tailwind colour block, JSON, or a swatch image for a moodboard.

Adjustable count

Five or six for a scheme, more when you want the full spread — the extraction re-runs instantly.

How to use the Extract Color Palette From Image

  1. 1

    Load a photo

    Images with clear, distinct colours give the most usable palettes.

  2. 2

    Choose how many colours

    Five or six is the usual number for a scheme; more starts to repeat.

  3. 3

    Check the contrast flags

    Each swatch shows whether black or white text passes on it.

  4. 4

    Export the palette

    CSS variables, Tailwind config, JSON, or a swatch image.

Frequently asked questions

By median-cut quantisation, which repeatedly splits the colour cube along its widest axis. That finds genuinely distinct colours rather than five near-identical shades of whatever dominates the frame.

Reviews of the Extract Color Palette From Image

What people who use the Extract Color Palette From Image think of it. Reviews come from visitors and are posted as written.

No ratings yet

Yours would be the first.

  • 5 0 reviews rated 5 stars
  • 4 0 reviews rated 4 stars
  • 3 0 reviews rated 3 stars
  • 2 0 reviews rated 2 stars
  • 1 0 reviews rated 1 star

Write a review

Used this tool? Your rating helps the next person decide.

Your rating

Plain text only — links, email addresses and HTML are not accepted. Your name and review are shown publicly; nothing else is collected. See the privacy policy.

0 reviews

Newest first

No reviews yet

Be the first to rate the Extract Color Palette From Image. It takes half a minute and no account.

Write the first review

More image tools