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 W3C design tokens (ready for Figma), Tailwind, 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

W3C design tokens that drop straight into Figma, a Tailwind config, or plain CSS 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 saved palette list and unlimited palettes.

Got images and a deadline?

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