Color Palette from Image
Drop in an image and get its dominant colors as a ready-made palette — adjust the count, then copy every HEX or CSS variable at once. Nothing is uploaded.
A color palette is extracted automatically the moment the image loads.
You can also paste an image straight from the clipboard with Ctrl + V (Cmd + V on a Mac).
Everything runs locally in your browser. Nothing is uploaded to any server — close the tab and your files are gone.
How to use
Drop in your image
Add a JPEG, PNG, WebP, AVIF, GIF, BMP or SVG, or paste one with Ctrl + V. Your browser reads it directly — there’s no upload and no waiting.
The palette builds itself
The moment the image loads, its dominant colors are extracted automatically using median-cut quantization — no button to press, no settings to configure first.
Adjust how many colors you want
Switch the count anywhere from 4 to 16 swatches to get a tighter brand palette or a wider one that captures more of the image’s range.
Copy the whole set
Grab every HEX at once, or copy the palette as ready-to-paste CSS custom properties. Need one exact pixel instead of a dominant color? The picker underneath still works — hover the image and click to sample it directly.
Frequently asked questions
How exactly are the dominant colors computed?
The image is sampled down to roughly 100,000 pixels, then grouped with median-cut quantization: the color cluster with the widest spread is split into two repeatedly until there are as many clusters as swatches you asked for, and each cluster is averaged into one color. Swatches are ordered by how much of the image they cover, so the first one is always the most dominant.
Why does the palette look different from Adobe or Coolors?
Every palette extractor makes its own tradeoffs in how it clusters pixels, so exact matches between tools are rare. This one uses median-cut, which favors flat, dominant regions of an image — logos and illustrations with a handful of solid colors extract cleanly, while photos with smooth gradients can extract slightly differently depending on how the tool weights color spread versus pixel count.
How many colors should I extract for a UI or brand palette?
For a brand board, 4–6 tends to surface just the dominant hues without noise. For a UI palette where you want room for a primary, a couple of accents, and neutral tones, 8–12 is a reasonable range — beyond that, later swatches are usually minor variations rather than genuinely distinct colors.
Can I use the extracted palette for a moodboard or brand board?
Yes — copy the HEX list into a design tool, or paste the CSS variables straight into a stylesheet to prototype with the image’s real colors instead of guessing them by eye.
What if I want one specific color instead of the palette?
Use the picker built into the same tool: hover anywhere on the image and a loupe magnifies the pixels around your cursor, then click or drag to lock in that exact color with HEX, RGB, HSL, HSB and CMYK all shown at once.
Does the image ever get uploaded anywhere?
No. It’s read and sampled entirely inside your browser using the Canvas API — there’s no upload step, and every color stays in that tab. Nothing is stored on a server, and closing the tab clears it all.