Color Palette Extractor
Pull the dominant colors out of any image with copy-ready hex codes. Runs in your browser — nothing is uploaded.
About Color Palette
Color Palette Extractor analyses an image and pulls out its dominant colours as copy-ready hex codes. Click any swatch to copy it. It runs in your browser, so the photographs and mockups you sample are never uploaded.
Designers reach for this when a colour scheme needs to come from somewhere real. Building a site around a hero photograph works far better when the interface colours are drawn from the image itself, because the palette is already harmonious — the photographer or the scene did that work. The same applies to matching a slide deck to a product shot, or pulling brand colours out of a logo when nobody can find the brand guidelines.
It is also the fastest way to recover a colour you can see but do not have a value for. A competitor's site, a screenshot of an old design, a printed brochure someone photographed, a client's existing marketing material — in all of these the colour exists only as pixels. Sampling gives you the hex code to work with, which beats squinting at a colour picker and guessing at the difference between two similar blues.
How to get a colour palette from an image
- Select the image you want to sample.
- Wait a moment while the dominant colours are calculated.
- Look through the extracted palette.
- Click any swatch to copy its hex code to your clipboard.
- Paste the values into your design tool, stylesheet or brand document.
Tips & common problems
Extracted palettes need editing
The dominant colours of a photo are not automatically a good interface palette. Expect to keep two or three, adjust their lightness, and add neutrals of your own.
Check contrast before using colours for text
Colours sampled from a photo are frequently mid-toned and fail accessibility contrast requirements against white. Darken them before using them for body text.
Crop to sample a specific region
If you want the colours of one object rather than the whole scene, crop to it first with Crop Image. The whole-image palette will otherwise be dominated by the background.
Compressed images shift colours slightly
Heavy JPG compression alters pixel values, so a sampled code may be marginally off. Sample from the highest-quality version you have.
Frequently asked questions
How do I get the colors from an image for free?
Select it and copy the hex codes of the dominant colours. No signup and nothing uploaded.
Are my images uploaded?
No. The colours are read in your browser, so client mockups and unreleased designs never leave your device.
What format are the colour codes in?
Hex codes such as #3B82F6, which work directly in CSS, Figma, Photoshop and essentially every design tool.
How many colours will I get?
A small set of the most dominant colours, which is what you can actually use. A palette of thirty near-identical shades would not be more helpful.
Can I extract colours from a logo to find brand colours?
Yes, and it is a common use when the original brand documentation has gone missing. Use the highest-quality version of the logo you can find, since compression shifts values slightly.
Why do the extracted colours look different from the image?
The palette shows dominant averages across regions rather than individual pixels, so a colour can look different in isolation from how it appears surrounded by others.