Color Palette from Image
Drop a photo and get its dominant colors as hex codes you can copy — plus a ready-made block of CSS variables. Great for building a palette from a logo, a mood board or a sunset. Your image never leaves your device.
How to use your palette ↓
How to use your palette
- Drop or paste an image, then pick how many colors you want (4–16). Tap any swatch to copy its hex code, or "Copy all hex" for the whole set.
- The CSS variables box gives you a paste-ready
:root { --color-1: … } block for your stylesheet.
- Colors are found with median-cut quantization on a downscaled copy of your image, so it's fast and picks the genuinely dominant tones (not one random pixel).
Privacy: the whole thing runs on your device — the image is read locally and analyzed on a canvas. Nothing is uploaded.
↑ Back to top
FAQ
How do I get the hex codes from a picture?
Drop the image here and the tool extracts its dominant colors. Tap any swatch to copy that hex code, or use "Copy all hex" to grab the whole palette at once.
Is my photo uploaded to make the palette?
No — it’s analyzed entirely in your browser on a canvas. The image never leaves your device and nothing is sent to a server.
Can I get CSS variables for the colors?
Yes — the CSS variables box gives you a ready-to-paste :root block (--color-1, --color-2, …) with every color in the palette.
How many colors can I extract?
Choose from 4 to 16. Fewer gives you the boldest dominant colors; more captures subtler tones in the image.