Color Palette Extractor

Pull the 6 dominant colors out of any image, with HEX/RGB/HSL values ready to copy.

Runs in your browser. Nothing is uploaded.

Drag & drop an image here, or click to browse

JPG, PNG, WEBP · up to 100MB

How to use

Color Palette Extractor in 3 steps

Add your image

Drop a JPG, PNG or WEBP file onto the drop zone, or click to browse.

Extract the palette

Click Extract palette. A median-cut color-quantization pass finds the 6 most representative colors.

Copy what you need

Click any swatch to copy its HEX code, or export the whole palette as ready-to-paste CSS custom properties.

Features

Why use this Color Palette Extractor

Median-cut color quantization finds genuinely representative dominant colors, not just the most frequent pixel.

Each swatch shows HEX, RGB and HSL values at once.

One click copies any value straight to your clipboard.

Export the full palette as CSS custom properties (:root variables) in one click.

FAQ

Questions about this tool

How are the dominant colors chosen?

This tool uses a median-cut algorithm, a standard color-quantization technique that repeatedly splits the image's color space into buckets of similar colors and averages each bucket — this tends to produce a much more representative palette than simply counting the most common exact pixel values.

Why 6 colors specifically?

6 is a practical number for most design use cases — enough to capture a primary, secondary and a few accent tones without overwhelming you with near-duplicate shades.

What can I do with the CSS export?

It generates a :root { --color-1: #...; } block you can paste directly into a stylesheet, giving you instant CSS variables matching the image's palette.

Does image size affect the result?

Very large images are automatically downsampled before analysis for speed — this has a negligible effect on the resulting palette since color distribution is preserved.