Colour palette from an image
Drop an image, get its five main colours as hex, RGB, OKLCH, and CSS variables.
Runs in your browser. No signup, no AI.
How it works
Drop an image, or paste one from your clipboard, and you get its five main colours as hex, RGB, OKLCH, and CSS variables, with how much of the image each one covers.
It runs k-means clustering on a small copy of your image, right in your browser. Nothing gets uploaded, so it works on unreleased designs too.
FAQs
How do I get a colour palette from an image?
Drop the image on this page. The five main colours show up with their hex codes, and you can click one to copy it.
What is OKLCH?
A newer way to write colours in CSS. The numbers match how bright and colourful a colour looks to people, so it’s easier to make a lighter or darker version.
Is my image uploaded anywhere?
No. It’s read and processed in your browser and never leaves your device.
From the blog
- How to find a website's colour palette: Three ways to get the exact colours a website uses, from Chrome dev tools to an eyedropper and a screenshot, and how to keep the palettes you like.
- Free marketing tools that don't want your email first: Free marketing tools with no email wall: UTM builder, ad specs, subject line preview, CAC and ROAS calculators, safe zones, and more.
- Design inspiration websites worth bookmarking: The design inspiration sites worth keeping open: landing pages, app screens, type, and the weird stuff, what each is good for, and what to do with what you find.
Want the whole swipe file?
Savepad launches soon. Leave your email and I'll let you know when it's live.