Image palette extractor
Upload a product photo or logo to get its dominant colors sorted by area. The same settings give the same result every time. Use it to build a brand color palette from a logo, or to match your store colors to your product photos.
Loading the tool…
Processing and privacy: Your files are processed inside your browser and are not uploaded to any server.
How to use it
- Choose a JPEG, PNG or WebP image.
- Set the number of colors from 2 to 12 and the size of the analysed sample.
- Turn on ignoring transparent pixels, near-white or near-black when the background dominates the result.
- Copy any color value, or download the whole palette as JSON, CSS variables, a PNG strip or a GPL file.
Example
An image that is half pure red and half pure blue, with 2 colors selected, gives #FF0000 at 50% and #0000FF at 50%.
A product photo on a white background: turn on “Ignore near-white” so the background does not take the largest share and the product’s own colors show up.
Limits and caveats
- The result is an approximation: the algorithm (median-cut family, cutting where variance is lowest) groups similar colors into boxes and shows the average of each box, so a swatch may not exist literally in the image, and a small color area can be merged into its neighbor.
- The image is reduced to the chosen sample size (100, 200 or 400 px on the longest side) with smoothing before analysis, so fine edges blend slightly. Images smaller than the sample size are analysed as they are.
- Shares are computed from the sample pixels left after the exclusions you chose and rounded to one decimal, so they may not add up to exactly 100.
- Values are sRGB values as decoded by your browser. Color profiles (ICC), wide-gamut images and JPEG decoding can give slightly different values in different browsers.
- Near-white means all three channels are 245 or more; near-black means 10 or less. A pixel counts as transparent when its alpha is below 128.
- The tool does not suggest matching colors or check contrast. Tested limits: 40 MB and 50 megapixels per image.
Questions about this tool
Do I get the same result every time?
Yes, in the same browser. The algorithm uses no random numbers, so the same image with the same settings gives the same palette. Values can differ slightly between browsers because decoding and downscaling differ.
Why is white the biggest color in my product photo?
Because the white background covers most pixels. Turn on “Ignore near-white” and the shares are computed from the product colors only.
What is the difference between the download files?
JSON holds the values, shares and the settings used; CSS gives variables you can paste into a site; PNG is a swatch strip for sharing; GPL opens in GIMP, Inkscape and Krita.
How do I get a color palette from an image?
Choose the image and set how many colors you want, from 2 to 12: the dominant colors appear sorted by area, with HEX, RGB and the share of each. Copy any color with one click, or download the whole palette as JSON, CSS, PNG or GPL.
How can I find out which colors are used in a picture?
Open the picture in the tool and it lists the most used colors with the share of the image each one covers. The result is an approximation because similar shades are grouped into one swatch; to read one exact pixel, use the image color picker.
