HohoTools

Color Palette Extractor

Every photograph, screenshot and illustration already contains a working palette — you just need to pull it out.

Click or drop files here

How to use

  1. Drop a PNG, JPG or WebP into the upload area.
  2. Choose how many colors to rank: 8, 16 or 24.
  3. Review each swatch with its HEX value and share percentage.
  4. Copy any HEX with one click and paste it into your design tool.

Frequently asked questions

How are the dominant colors calculated?

With a fixed-resolution pixel histogram. Each RGB channel is quantized to its high 4 bits (16 levels per channel, 4096 buckets in total); pixels fall into a bucket, buckets are ranked by pixel count, and each ranked color is the average of the pixels inside its bucket. It is a deterministic approximation — the same image always produces the same palette.

Is this k-means clustering?

No, and that is deliberate. K-means produces nicer-looking centroids but is slower, iterative and implementation-dependent. This tool uses transparent bucket counting: fewer moving parts, fully reproducible, and honest about what a pixel census actually says. Bucketing can merge visually similar colors that share the same 16-level channel range.

Why do my photo results contain several similar greens?

Photographs and gradients spread pixels across neighboring buckets, so close tones appear as separate entries with individual percentages. That is the real distribution of the image, not noise — pick the largest bucket for a flat accent, or merge neighbors yourself when you want a compact palette.

How are transparent areas handled?

Pixels with an alpha below 128 are skipped entirely: they neither get a bucket nor count toward the share percentages, so a cut-out logo or sprite is ranked by its visible pixels only. An image with no opaque pixels at all is rejected with a clear error instead of an empty result.

What if the image has fewer colors than my Top N?

You simply get fewer swatches — the tool lists every bucket it found, ranked, and never pads the list. A 4-color pixel logo asked for 24 colors returns exactly those 4 colors with percentages rounded to one decimal, summing to roughly 100%.

Is my image uploaded anywhere?

No. Decoding, bucketing and ranking all run locally in your browser, and nothing ever leaves your device, so unreleased artwork and licensed photos stay private.

Related tools

Color Picker from Image Matching a color you can see but cannot name is a daily problem in front-end work, slide design and photo retouching. image Color Shades Generator This free color shades generator takes one hex color and expands it into a complete tonal scale: ten shades stepping toward black and ten tints stepping toward white, laid out as a grid you can copy from with a single click. utility Color Contrast Checker This free contrast checker measures any foreground/background color pair against the WCAG 2.x contrast formula and tells you instantly whether text in that combination passes accessibility thresholds. utility Image Grayscale Converter Grayscale is more than removing color: how each channel is weighted decides whether the result looks natural or muddy. image Random Color Generator This free random color generator produces uniformly random hex colors right in your browser, using crypto.getRandomValues — the same cryptographically secure source browsers reserve for keys and tokens. utility
About this tool

Every photograph, screenshot and illustration already contains a working palette — you just need to pull it out. This extractor counts the pixels of your PNG, JPG or WebP and ranks the most frequent colors so you can reuse them in slides, dashboards, mood boards, theme files or marketing graphics without guessing from memory. Quantization buckets each RGB channel into sixteen levels (4 bits per channel, 4096 buckets in total), then reports the top 8, 16 or 24 buckets with an exact share percentage and a one-click copyable HEX value. Fully transparent pixels are ignored so a cut-out sprite does not pollute the ranking, and everything runs locally in your browser — artwork under NDA never leaves your device. The counts are an honest histogram, not a magic re-coloring: photographs with gradients produce many similar buckets, which is exactly what lets you see a design's real color weight distribution. Pick a smaller Top N for a tight brand palette, or a larger one to explore a scene's full color range.