Palette

Palette extracts the dominant colors from an image using median cut and gives you between two and sixteen of them as hex, rgb and hsl. The image is decoded and sampled in your own tab and nothing is uploaded — this is the one tool that only reads, and writes no file back. Sampling runs on a nearest-neighbour copy no larger than 320 pixels on its long edge, so a 24-megapixel photo costs the same as a thumbnail and a flat graphic keeps its exact colors rather than blended ones.

How it works

  1. Drop an image One file. It is decoded in the tab and a sampling copy is drawn at no more than 320 pixels on its long edge, with image smoothing turned off.
  2. Choose how many colors Drag the slider between two and sixteen. The set is recalculated as you drag, and it is deterministic: the same image and the same number give the same palette every time.
  3. Copy what you need Click any swatch to copy its hex. The two buttons copy the whole set as CSS custom properties, numbered --color-1 upward, or as a Tailwind colors block ready to paste into tailwind.config.js.

Questions

How are the colors chosen?
By median cut. Every distinct color in the sample starts in one box, the box with the widest single channel is split at that channel's weighted median until there are as many boxes as you asked for, and each box is then averaged down to one color. The results come back most common first, and fully transparent pixels are skipped so they cannot drag an average toward black.
Why did I get fewer colors than I asked for?
Because the image holds fewer distinct colors than that. A two-colour logo cannot yield six, so the tool returns what is really there and tells you rather than inventing shades. It samples at most 32,768 pixels, evenly stepped through the image, so two runs over the same file walk the same pixels.
Is each swatch a real pixel from the image?
Each swatch is the weighted average of a group of colors from the image, so it is representative rather than a literal pixel. The downscale before sampling uses nearest-neighbour instead of smoothing, which is what stops the tool inventing colors that appear in no pixel of the original.

Every tool