Specimen no. 02 · the pressing
Palette from image
Press a picture down to its dominant colors. Choose how many, see how much of the image each one covers, and export them for your stylesheet.
Drop an image on this sheet
or paste one with Ctrl+V (⌘+V on a Mac)
JPEG, PNG, WebP, GIF, AVIF or SVG. The image stays on your device.
Your palette
Open an image, or try the sample, and its colors will be pressed here.
:root {
/* your palette appears here */
}
How the palette is found
The picture is shrunk to about a quarter of a million pixels, and every pixel is dropped into one of 32,768 color bins. The bins are then grouped by k-means clustering in OKLab, a color space where equal distances look like roughly equal differences, so the groups follow what your eye sees rather than raw RGB numbers. Each group's average becomes a swatch, and its share is how much of the picture it covers. Transparent pixels are left out.
Colors sets how many groups to look for. Three or four give a broad summary of the mood; ten or twelve pick up small accents, like a poppy in a wheat field. The same image always gives the same palette. Order sorts by share, around the color wheel, or from light to dark for building a scale.
CSS variables exports a :root block of custom properties named with your prefix. JSON lists each color with its RGB, OKLCH and share. PNG swatch strip saves a 1200 × 400 picture of the swatches with their HEX codes, ready for a mood board.
Questions
Why is a small accent color missing?
Clustering favors large areas, so a tiny spot of color can be folded into its neighbor. Raise the number of colors, or read that exact spot with the image color picker.
Why do two swatches look almost the same?
When a picture holds fewer distinct colors than you ask for, the biggest area gets split into shades of itself. Lower the number until every swatch is clearly different.
Does the extraction happen on a server?
No. The clustering runs in a background thread of your own browser, so the page stays responsive and the image never leaves your device.