How to extract a color palette from an image

Matching a design to a reference image starts with its colours. Instead of eyedropping pixel by pixel, extract the whole palette at once.

Step by step

1. 1Open the Color Palette Extractor and drop, browse, or paste an image.
2. 2Choose how many colours you want — 4, 6, 8 or 12.
3. 3Click any swatch to copy it as HEX, RGB or HSL.
4. 4Or export the whole palette as CSS variables, JSON, or a Tailwind colour config.

How it picks the colours

The tool uses median-cut quantisation — the classic palette algorithm — so the swatches are the colours that actually dominate the image, ordered by how much area they cover, not just the brightest pixels. The image is read locally and never uploaded.