From product photos to ready-to-paste colour tokens.

Drop in up to five images. Distil picks four colours, builds full shade scales, and exports as Tailwind, Shadcn, or plain CSS. Made for designers handed a folder of imagery and a deadline.

Preview is free. Your images stay in your browser.

What it does

🔒

Stays on your device

Colour extraction runs in your browser via the Canvas API. We never see your images, and neither does our server.

🎨

Four colours, not forty

Quantisation picks the four colours that actually matter across all your images. No noisy 20-swatch palette to wade through.

📐

Full shade scales

Each colour gets 11 steps from 50 to 950, distributed in OKLCH so the lightness curve looks right rather than mechanically even.

🏷️

Roles, not just hex codes

Distil suggests which colour is your primary, secondary, accent, and neutral. Swap any of them if you disagree.

🛠️

Paste-ready exports

Tailwind config, Shadcn CSS variables, or plain custom properties. Switch formats whenever. One palette covers all three.

🔗

Permanent links, no account

Pay per palette and get a link you can bookmark forever. Or go Pro for a project list with 100 new palettes a month.

What people are saying

"Got handed three product shots on a Friday afternoon. Had a working Tailwind config by 4pm."

First Last

@handle

"The OKLCH shade scales won me over. They actually look right in a dark UI, which is rare."

First Last

@handle

"Tried it because the images stay in the browser. Stayed because the role assignments were spot on."

First Last

@handle

Got images and a deadline?

Drop in your first batch. The preview is free, and you can decide whether to save it after.