Color Palette Extractor

Extract dominant colors from your images instantly.

Drag & Drop image here

or click to select file

Best under 50MB / 1 file

This color palette extractor finds the main colors in an image and gives you their HEX codes. Add a photo, logo or screenshot and it returns 3, 6, 9 or 12 colors, ordered by how much of the picture each one covers. Use it to build a palette from a photograph, match a design to a brand image or find the code for a color you like. The image stays in your browser.

How to Extract Colors from an Image

  1. Add the image: drag it into the box above or click to choose a file.
  2. Set the number of colors: the palette starts at six. Choose 3, 9 or 12 and press Update to change it.
  3. Copy a color: click a swatch to copy its HEX code, or hover to see the RGB value.
  4. Copy the palette: the button under the swatches copies every HEX code at once.

How Many Colors to Choose

ColorsWhat you getGood for
3The broad areas of the picture onlyA logo, or a main, secondary and accent color
6The main colors with one or two accentsA website or presentation theme
9Lighter and darker versions of the main colorsIllustration and interface work
12Small accents that a short palette averages awayDetailed photos with many separate colors

How the Palette Is Worked Out

The image is first reduced to a small copy, at most 100 pixels on its longer side, which keeps the color balance and makes the work fast. Transparent pixels are left out. The remaining pixels are then sorted into groups of similar color by a method called k-means clustering: it places one point for each color you asked for, assigns every pixel to the nearest point, moves each point to the average of its pixels, and repeats until the groups settle. Each swatch is the average color of one group, and the percentage is the share of pixels in it. Because small details are averaged with their neighbors, a tiny bright accent may only appear when you ask for more colors. An image with fewer distinct colors than you asked for, such as a flat two-color logo, gives a shorter palette.

Frequently Asked Questions

How do I get a color palette from an image?

Add the image to the extractor above. It shows the six main colors with their HEX codes. Change the number of colors to 3, 9 or 12 and press Update for a shorter or longer palette, then click a swatch to copy its code.

Why is a swatch not exactly a color I can see in the picture?

Each swatch is the average of a group of similar pixels. A blue sky is thousands of slightly different blues, and the palette shows the blue in the middle of them. That average is usually more useful for design than any single pixel.

What does the percentage under each color mean?

The share of the picture that belongs to that color group. A background color may cover 60% while an accent covers 3%. The swatches are listed from the largest share to the smallest.

Can I get RGB values as well as HEX?

Yes. Hover over a swatch to see its RGB value. Clicking the swatch copies the HEX code.

Will the same image always give the same palette?

Yes. The same picture with the same number of colors gives the same result each time.

Is my image uploaded?

No. The colors are worked out by your browser on your own device and the image is not sent to a server.