Image palette extraction — Settings and quality

Worked example

The extractor has no dials: it gives up to eight swatches, so your real controls are the crop, the image and how many you keep.

Rounding to steps of 24 means each swatch is the middle of a bucket, not an exact pixel, so a value can be up to roughly 12 units per channel away from the true colour. That keeps results stable and fast on a 160 pixel working copy, but it is why the swatch for a brand red may read #D83030 when the logo is #D92B2B. For exact values, click that spot with the picker.

A designer building a landing page from a product photo usually needs only three or four colours: one background tone, one text tone and one accent. Take the first swatch that fits as background, a dark one for text, and a saturated one for buttons, and ignore the rest rather than using all eight.

The typical mistake is ranking colours by order in the list as if it were design importance. The order is only pixel count: a huge dull background comes first, while a small bright accent can come last or not appear. Crop tightly around the accent when you need it to rank higher.

Tradeoff: a tighter crop gives the accent more weight but may lose the calm base colours, and a wide shot keeps the mood but favours the background. Run the extractor twice, once wide and once tight, and combine the best swatches from both.

Image with several dominant colors

Palette swatches and color codes

Counts are on a reduced copy at most 160 pixels on the long side, so tiny details in the original have almost no influence.