Color Palette Extractor
Grab the main colours from any image as swatches you can copy.
Using toolbook means you agree to our Terms and Privacy Policy.
or drag it here
PNG, JPG, WEBP, or HEIC
Your files stay on your device
How to use it
Drop an image here to get its main colours as swatches with HEX and RGB codes, each ready to copy. Your images stay on your device.
Love the colours in a photo, a logo, or a design you saw? Drop the image onto the box above and get its main colours as swatches.
Choose 4, 6, or 8 colours. The first swatch is the one that covers the most of the image. Click any code to copy it.
Building a website? “Copy as CSS variables” gives you all the colours ready to paste into your stylesheet.
iPhone photos work too.
FAQ
How many colours can I get?
4, 6, or 8. More swatches show subtle shades separately; fewer group similar shades together.
Can I use the colours in CSS?
Yes. “Copy as CSS variables” copies them as --color-1, --color-2, and so on.
Can anyone else see my image?
No. Colours are worked out on your device and your image is never sent anywhere.
How it worksFor the curious
The image is drawn onto a small offscreen canvas and every visible pixel is read back with getImageData. Colours are grouped with median-cut quantisation: the widest colour range is repeatedly split in half until there are as many groups as swatches, then each group is averaged.
The image is downscaled to a few hundred pixels per side first, which is plenty to find dominant colours and keeps it fast for any file size. Fully transparent pixels are skipped, and results are sorted by how much of the image each colour covers.
HEIC photos are decoded the same way as the site’s HEIC converters.