Image Color Palette Extractor
Extract a colour palette from an image and copy it as HEX, RGB, HSL, CSS custom properties, a Tailwind config block or JSON. The colour space is split repeatedly along its widest axis rather than counting identical pixels, and that choice is the whole difference between a useful palette and a useless one: in a photograph no two pixels match exactly, so counting them returns six near-identical shades of the same patch of sky. Each swatch reports what share of the image it covers, and a single proportional bar shows the overall colour balance at a glance. Every swatch is shown with black or white text according to which is actually readable on it. The image never leaves your device.
How it works
Upload an image and its main colours are pulled out as a palette you can copy as HEX, RGB, HSL, CSS variables or a Tailwind config block. Each swatch shows what share of the picture it covers.
The colour space is split repeatedly along its widest axis rather than counting identical pixels — in a photograph no two pixels match exactly, and counting them returns six near-identical shades of the same sky. The image never leaves your device.
Frequently asked questions
How does it choose the colours?
By median cut — the colour space is split repeatedly along its widest axis, so the palette spans the colours actually present rather than returning several near-identical shades of the most common one.
How many colours can I extract?
Between 2 and 16. Fewer gives the overall impression of the image; more picks up smaller details and accent colours.
What does the percentage next to each colour mean?
How much of the image that swatch represents. The bar above the swatches shows the same information as a single proportional strip.
Can I export the palette for my code?
Yes — HEX, RGB and HSL lists, CSS custom properties, a Tailwind colours block, or JSON. Click any individual swatch to copy just that colour.
How is this different from the colour picker?
The picker reads the exact colour of one pixel you click. This finds the set of colours that best represents the whole image.
Is the image uploaded?
No. It is decoded and analysed in your browser, and nothing is sent anywhere.
Related tools
Image Color Picker
Click any pixel on an uploaded image to read its exact color as HEX, RGB and HSL, right in your browser.
Color Converter (HEX / RGB / HSL / HSV / CMYK)
A color converter for HEX, RGB, HSL, HSV and CMYK, with a built-in WCAG contrast checker.
Tint and Shade Generator
Build a full palette ramp of tints, shades and tones from one colour, and export it as CSS, SCSS or JSON.