Color Palette from Image
Pull the dominant colors out of any image as copyable hex and RGB swatches, then export the palette. Free, private and processed entirely in your browser.
Colors are sampled in your browser — your image is never uploaded.
How it works
The image is drawn onto a small <canvas> — shrunk for speed — and its
pixels are read back with getImageData. Those pixels are fed to a median-cut
routine: it starts with every color in one box, repeatedly splits the box whose red, green
or blue range is widest, and finally averages each resulting box into one representative
color. That produces a balanced palette that reflects the whole image, not just its single
most frequent pixel. Transparent pixels are ignored so they cannot distort the result. All
of this runs locally in JavaScript, so your image is never uploaded.
How to extract a color palette from an image
- Click the box and choose an image, or drag one in.
- Choose how many colors you want in the palette.
- Click Extract colors to sample the dominant shades.
- Click a swatch to copy its hex, or copy all values at once.
- Optionally export the palette as a text file.
Why pull colors from an image
A palette lifted from a photo is a shortcut to a cohesive design. Pulling the main tones from a hero image lets you match buttons, headings and backgrounds to the artwork instead of guessing hex codes. Designers build moodboards this way, developers grab a brand’s exact colors from a screenshot, and anyone theming a slide deck or a site can sample a reference picture and copy the values straight into their CSS or design tool.
Because the sampling happens in your browser, there is no upload and no account — useful when the source is client work or an unreleased design you would rather not send to a third party. Click a swatch to copy its hex, grab them all at once, or export a text file to keep the palette on hand. Working with the same image elsewhere? Resize it with the resizer, crop it with the cropper, or convert it with the converter.
Related tools
Frequently asked questions
How do I get a color palette from an image?
Drop an image, choose how many colors you want, and click Extract colors. The tool samples the picture and shows the dominant shades as swatches with their hex and RGB values, ready to copy.
How are the dominant colors chosen?
The image is scaled down and its pixels are grouped with a median-cut algorithm, which repeatedly splits the colors along their widest channel and averages each group. This finds a small set of representative colors rather than just the single most common pixel.
Can I copy the hex and RGB values?
Yes. Click any swatch to copy its hex code, use Copy all to grab every hex value at once, or use Export palette to download a plain-text list with both hex and RGB for each color.
Are my images uploaded to read their colors?
No. The image is decoded and sampled with the Canvas API entirely in your browser. Nothing is sent to a server, so moodboards, screenshots and client artwork stay private.
How many colors should I extract?
Five or six colors make a tidy palette for a brand or theme. Pick more — up to twelve — when you need a fuller range from a complex photo, and fewer when you only want the headline tones.
Does it ignore transparent areas?
Yes. Fully or mostly transparent pixels are skipped so they do not skew the result, which means a logo on a transparent background returns the logo’s real colors rather than a phantom shade.
Image Tools reads image colors entirely within your browser. Files are never uploaded.