Image Color Palette Extractor

Upload one photo and get a usable palette from it: the dominant colors in the picture, a contrast ratio for every pair, and code you can paste straight into a website — CSS variables, Tailwind v3 or v4, or JSON. Everything runs in your browser. No upload, no signup, nothing is downloaded until you tap a Download button.

Choose an image first. Its palette will appear below.

No image chosen yet.

How the palette is made

  1. Choose one image. A small copy (at most 120 px on the longest side) is drawn on your device and its pixels are sampled — the original file is never uploaded or changed.
  2. Click Extract palette. A median-cut split groups the sampled pixels into the number of colors you chose, and each group is averaged into one swatch, shown with its share of the sampled pixels.
  3. Check any text/background pair, or read the full pair table, then copy the CSS, Tailwind v3/v4 or JSON block — or tap Download palette.css / Download palette.json to save it.

Frequently asked questions

Is this an AI-generated palette?

No. These are the dominant colors actually present in your photo, found by sampling its pixels. They are not harmonized, recolored or invented by a model, so a dull photo gives a dull palette — try a more colorful photo if the result looks flat.

What does the contrast ratio mean?

It is the WCAG relative-luminance ratio between two colors: 4.5:1 or higher passes AA for normal text, 3:1 or higher passes AA for large text only, and 7:1 or higher passes AAA for normal text. A passing pair is not a full accessibility pass for a page — font size, weight, other elements and real users still matter.

Do screen colors match print colors?

No. These are screen (RGB) colors from your photo. Printed colors will differ, so do not use this palette as a print brand-color proof.

What happens with transparent PNGs?

Fully transparent pixels are ignored, so the palette comes from the visible parts of the image only. That is also why a mostly transparent logo may give fewer useful colors.

Are my images uploaded?

No. Sampling, palette building, contrast math and code export all run on your device, in your browser.

Related tools: Color Picker for a single color code, Image Editor to adjust a photo before extracting its palette, and Image Converter to change its format first.