Image picker

Pull a palette from any photo, and find out if you can set text in it.

Extraction

What the image is mostly made of, by area.

Colours
5

Drop an image here

No size limit, no upload. The file is read in your browser and never sent anywhere — you can check the network tab.

What image colour picker is

A tool that extracts a palette from a photograph by clustering its pixels. The space the clustering runs in decides the result, and the palette that comes out of a photograph is usually not one you can set text in — both of which most pickers leave unsaid.

What this tool does that others do not

  • Clustering in OKLab, not sRGB

    Distance in sRGB badly overstates differences between dark colours and understates them between light ones, so an sRGB clusterer returns five muddy near-identical darks from a photograph that obviously contains five different colours. OKLab is perceptually uniform, so numerical distance matches what your eye reports and the clusters land where you would have put them.

  • Dominant and distinct are different questions

    Dominant answers what the image is mostly made of by area — a photo of a beach returns four sands and a sky. Distinct answers which colours are actually different from each other. Most pickers only answer the first and do not say which one they answered.

  • Accessible mode fixes the mid-tones

    Photographs are full of mid-tones, and a mid-tone only just reaches 4.5:1 on the better of white or black — never comfortably on either — so a beautiful five-swatch palette often contains nothing you can set body copy in at a size that reads. Accessible mode moves each swatch along its own lightness axis until it clears 4.5:1 on white, holding the hue, so the palette still comes from your photograph.

How to use it

  1. Drop the image in at whatever size it is

    It is downscaled internally before the pixels are read, because clustering a twelve-megapixel photograph produces the same palette as clustering a small one and takes far longer.

  2. Choose the question you are asking

    Dominant for a mood or a background; distinct when you need colours that will not be confused with each other.

  3. Read the contrast figure on each swatch

    That is the number that decides whether the palette can be used for anything other than fills.

  4. Switch on accessible mode before you export

    It keeps the hues the photograph gave you and returns versions you can ship.

Worked example

Real input, real figures.

An amber pulled out of a sunset

You give it

An extracted swatch of #e8b04b.

You get

1.95:1 on white — unusable as text. Accessible mode returns #a16c00 at 4.51:1, holding hue 79° and moving lightness from 0.791 to 0.572. The colour still belongs to the photograph.

Against a typical image palette extractor

AspectThis toolA typical extractor
Clustering spaceOKLab, perceptually uniformsRGB
Extraction modeDominant, distinct or accessible, namedOne unnamed mode
Usability checkMeasured contrast on every swatchNone
Fixing a failing swatchLightness search at the same hueNot offered
UploadNone — decoded in the tabFile posted to a server

Guide

Why the clustering happens in OKLab

Extraction is k-means clustering over the pixels, but the space it runs in decides the result. Distance in sRGB badly overstates differences between dark colours and understates them between light ones, so an sRGB clusterer returns five muddy near-identical darks from a photograph that obviously contains five different colours.

Running it in OKLab — a perceptually uniform space — means numerical distance matches what your eye reports, so the clusters land where you would have put them.

A palette from a photo is rarely usable as text

Photographs are full of mid-tones, and a mid-tone only just reaches 4.5:1 on the better of white or black, never comfortably on either. A palette that looks beautiful as five swatches will often have nothing in it you can set body copy in.

So every swatch here carries its measured contrast against white, and accessible mode fixes the ones that fail by moving lightness only. You keep the colours the photograph gave you; you just get versions of them you can ship.

Questions people ask

Straight answers. Each one links directly: copy the address after opening it.

Is there a file size limit?

No. The image is decoded and read in your browser, so there is nothing to upload and nothing to cap. It is downscaled internally before the pixels are read, because clustering a twelve-megapixel photo produces the same palette as clustering a small one and takes far longer.

What is the difference between dominant and distinct?

Dominant answers what the image is mostly made of, by area — a photo of a beach returns four sands and one sky. Distinct answers which colours are actually different from each other. They are different questions and most pickers only answer the first.

What does accessible mode do?

It takes the extracted palette and moves each swatch along its own lightness axis until it clears 4.5:1 as text on white, holding the hue. The palette still comes from your photograph; it is just usable as text afterwards.

Does my image leave the browser?

No. There is no upload step and no server to upload to. Open your network tab while you use it, or switch off your connection — it keeps working.