Skip to main content
SK Play Labs logoSK Play Labs

Colour Palette Extractor

Pull a colour palette out of any image.

Runs entirely on your device — your files never leave your browser.

Drop an image to pull its colours

PNG, JPG, WebP or GIF · drag & drop, paste, or click to browse

Runs entirely in your browser — nothing you enter is uploaded or sent to a server.

These are the image's most representative colours grouped by a median-cut algorithm — a close approximation, not the exact pixel values, so a swatch may differ slightly from any single point in the photo. Colours are sampled from a shrunk copy for speed. The image is read in your browser and never uploaded. Read our full disclaimer.

About this tool

Every image has a handful of colours that define its look. This tool finds them: it samples the picture and groups the pixels into a palette of the most representative colours, ordered by how much of the image they cover. Each swatch gives you the value in HEX, RGB, or HSL, ready to copy into your CSS, design tool, or brand guide. Choose how many colours you want, and grab one or the whole set at once. The image stays on your device — the colours are read right in your browser.

Matching a photo

Drop in a landscape photo, set 6 colours — you get its sky blue, foliage green, and earthy tones as hex codes, ready to paste into a design.

How to use

  1. 1Drop in an image — a photo, screenshot, logo, or artwork.
  2. 2Pick how many colours you want (4 to 10).
  3. 3Switch the value format between HEX, RGB, and HSL.
  4. 4Click any swatch to copy its value, or Copy all for the whole palette.

Features

  • Dominant-colour palette via median-cut quantisation, ordered by coverage.
  • 4, 6, 8, or 10 colours — your choice.
  • Every swatch in HEX, RGB, or HSL; click to copy, or copy the whole set.
  • Works on any image — photos, screenshots, logos, art.
  • Runs entirely on your device; the image is never uploaded.

Frequently asked questions

How are the colours chosen?

The tool samples the image and uses median-cut quantisation — it repeatedly splits the colours along their widest range until it has the number you asked for, then averages each group. The result is the image's most representative colours, sorted by how much of it they cover.

Why isn't a swatch an exact colour from the image?

Each swatch is the average of a cluster of similar pixels, not a single point, so it represents a region of the image rather than one exact pixel. That's what makes it a useful palette rather than a random sample.

Can I get the values for CSS?

Yes. Switch the format to HEX, RGB, or HSL and click a swatch to copy that value, or use Copy all to get the whole palette as a comma-separated list to paste straight into your styles.

Is my image uploaded to read its colours?

No. The picture is drawn onto a canvas and its pixels are read in your browser; nothing is sent to a server.

More image tools

View all