Free Color Extractor
NewThis free tool pulls the dominant colors out of any image in your browser and gives you each one as a copyable HEX, RGB, or HSL value, along with how much of the picture it covers.
Drop an image here
PNG, JPG, WebP, or GIF
Runs entirely in your browser. Your images are never uploaded to a server.
How it works
- Drop an image onto the box above, or click to choose one.
- The palette appears immediately as a bar showing how much of the image each color covers, then as a list.
- Choose how many colors you want, and whether to read them as HEX, RGB, or HSL.
- Click any swatch to copy that value, or copy the whole palette at once.
Common use cases
- Building a brand palette from a photograph or a piece of artwork.
- Matching a website's colors to a hero image so the page feels of a piece.
- Pulling the exact hex out of a logo when you were only sent a picture of it.
- Finding complementary colors for a design from a reference image.
- Working out what colors dominate a competitor's imagery.
Frequently asked questions
- How does it decide which colors matter?
- It groups every pixel by color and repeatedly splits the largest group along whichever channel it varies in most — an approach called median cut. The result is weighted by how much of the image each color actually covers, so a large muted background outranks a tiny bright detail, which matches what a person would call the dominant color.
- Why are the colors slightly different from the pixels in my image?
- Each swatch is the average of a group of similar pixels, not one sampled pixel. That is deliberate: a photograph of a red wall contains thousands of slightly different reds, and the useful answer is the one in the middle of them rather than whichever pixel happened to be picked.
- What is the percentage on each swatch?
- How much of the image that color and its near neighbours account for. The bar at the top shows the same thing proportionally, which is usually the fastest way to see what a picture is really made of.
- Should I use HEX, RGB, or HSL?
- HEX for web and design tools, since it is what most of them expect. RGB when a tool asks for channels separately. HSL when you want to adjust a color by eye — it separates hue from saturation and lightness, so making something a bit darker or a bit less intense is one number rather than three.
- Does it read transparent areas?
- No. Fully transparent pixels are skipped, so a logo on a transparent background gives you the logo's colors rather than a palette half made of nothing.
- Is my image uploaded to a server?
- No. The image is analysed entirely in your own browser. It never leaves your device, and nothing is stored.