Color Palette Extractor

Pull the dominant colors (with hex codes) from any image.

Drop image here or click to choose

100% private — nothing is uploaded.

Every image has a story told in colour. Our free colour palette extractor analyses any photo and pulls out its dominant colours, giving you the exact hex codes you can copy straight into a design, website, or brand kit.

Designers use it to build palettes from inspiration photos, developers to grab CSS colours, and anyone to find the perfect shade. The image is analysed in your browser, so nothing is uploaded.

How to extract a colour palette
1

Add your image

Drag and drop a photo or click to browse. Any JPG, PNG or WebP works.

2

Extract colours

The tool scans the image and surfaces its most dominant colours automatically.

3

Copy the hex codes

Each swatch shows its hex value, ready to copy into your CSS, design tool or brand palette.

Why use this palette extractor
🎨

Instant palettes

Turn any photo into a ready-made colour scheme — perfect for moodboards and brand kits.

#️⃣

Exact hex codes

Get copy-ready hex values for every dominant colour, straight into your CSS or design tool.

🔒

Runs locally

The image is analysed in your browser; it is never uploaded or stored anywhere.

What a colour palette is used for

A palette is a small, deliberate set of colours that work together, and it is the foundation of almost any visual project. Pulling one from a photograph is a designer’s favourite shortcut, because nature and good photography have already done the hard work of choosing colours that harmonise.

Once you have the palette you can use it to:

Understanding hex codes

Every colour on a screen is described by a hex code — a six-character value like #4f46e5 that tells the browser exactly how much red, green and blue to mix. The first two characters are the red channel, the next two green, and the last two blue, each ranging from 00 to FF. You do not need to memorise any of that; the point is that a hex code is a precise, universal name for a colour.

Because hex is the standard everywhere — CSS, design apps, and most graphics software — copying the code from a swatch here drops the exact same colour into whatever you are building. There is no guessing or eyeballing, and the shade you saw in the photo is the shade you get in your project.

Getting a better palette from a photo

The tool samples the pixels of your image and groups the most common colours into a handful of dominant swatches. The quality of the palette depends a lot on the photo you feed it. Images with clear, distinct areas of colour — a sunset, a plate of food, a painted wall — produce clean, usable palettes. Very busy or muddy photos can give muddier results.

For the best output, choose a photo where the colours you care about actually dominate the frame. If you want the palette of a single object, crop to it first so the background does not skew the sample. A well-lit, well-composed image almost always yields a more attractive scheme than a cluttered one.

Frequently asked questions
How does the colour extractor work?

It samples the pixels of your image and groups them to find the most dominant colours, then displays each one with its hex code.

How many colours does it pull out?

It returns a handful of the most prominent colours in the image — enough to form a usable palette without overwhelming you.

Can I get the hex codes for CSS?

Yes. Every swatch shows a standard hex code (like #4f46e5) that you can copy directly into CSS or any design app.

How do I get a cleaner palette?

Use a well-lit photo where the colours you want dominate the frame, and crop to a single subject first if the background is distracting.

What image formats are supported?

JPG, PNG and WebP all work. Photos with clear, distinct colours produce the most useful palettes.

Is my image uploaded?

No. The colour analysis runs entirely in your browser and your image never leaves your device.

More free image tools
🗜️

Compress Image

Reduce image file size without losing quality

📐

Resize Image

Change width & height in pixels

✂️

Crop Image

Cut to a size or aspect ratio

🔄

Convert Image

JPG, PNG & WebP converter

🔁

Rotate & Flip

Turn or mirror your image

📄

Image to PDF

Combine images into one PDF

💧

Add Watermark

Add a text watermark

🔤

Image to Base64

Get a data-URI / CSS snippet