Tools
Palette extractor
Extract a colour palette from an image
Pull the colour palette out of any photo or image and export it in several formats.
Drop an image here
or click to choose a file, or paste one
About this tool
The palette extractor analyses a photo or illustration and gives you back the colours it is made of. Use it to build a palette from a reference image, to theme a website around its hero photo, to put together a moodboard, or to capture the tones of a product, painting or landscape without clicking round pixel by pixel with an eyedropper.
Drag an image into the box, click to choose one or paste it from your clipboard. Then choose what to bring out: dominant, vibrant, muted, light, dark, warm, cool or accent colours. Use − and + to set how many colours you want (3 to 11), and press “Re-extract” or the space bar for another take. The list shows how much of the image each colour covers, and you can copy the lot, copy it as CSS variables or open the palette in the generator.
Your image stays on your device: it is read and analysed in the browser and never uploaded. Any format your browser can open works (JPG, PNG, WebP, GIF and, in most browsers, AVIF). To keep things quick, the image is scaled down to 150 pixels on its longest side before the colours are grouped, so very small details may be missed. Transparent pixels are ignored.
Frequently asked questions
How do I get the colours from a photo?
Load the photo into the extractor and a palette of its main colours appears. Hover over (or tap) each swatch to copy its code, or use “Copy all” to take them all at once.
Why does the palette change slightly each time?
Colours are grouped with a k-means algorithm that starts from random points, so each extraction can produce slightly different shades. If you do not like a result, press the space bar to try again.
What is the difference between dominant, vibrant and accent colours?
Dominant colours cover the most area; vibrant ones are the most saturated, even if small; accents are rare colours that sit far from the main set, like a red detail in a mostly green photo.
Can I use the palette in Tailwind or my CSS?
Yes. “CSS variables” copies a ready-to-paste :root block, and every colour in the list has a button that opens it in the Tailwind shade generator.