Color Palette from Image
Upload any photo or illustration and instantly extract the dominant color palette. Get hex, RGB and HSL codes for every color — copy individually or export as CSS variables. Free, runs in your browser, nothing uploaded.
What you can do with this tool
Extract dominant colors
Upload any photo, illustration, or screenshot and extract 4–10 dominant colors using a median cut algorithm for accurate results.
Copy hex, RGB and HSL
Click any swatch to copy its hex code instantly. Each swatch also shows the RGB and HSL values for use in design tools or code.
Export as CSS variables
Get a ready-to-paste CSS snippet with all colors as custom properties — paste into your stylesheet and start using immediately.
Download palette as PNG
Save your palette as a PNG image to share with teammates, drop into a design file, or use as a visual reference.
100% private
Everything runs in your browser using the Canvas API. Your image is never sent to any server — it stays on your device the entire time.
Choose color count
Pick between 4, 6, 8 or 10 colors. More colors captures subtle tones; fewer gives a cleaner, more usable palette.
How to extract a color palette from an image
Upload your image
Drag and drop or click to browse. Any JPG, PNG, GIF or WebP works. A photo, brand asset, or UI screenshot are all great starting points.
Extract colors instantly
The tool analyses every pixel using a median cut algorithm and surfaces the most visually dominant colors in your image.
Adjust the count
Choose 4, 6, 8 or 10 colors. The palette updates instantly — no re-upload needed.
Copy, export or download
Click any swatch to copy its hex code. Export CSS variables for your project, or download the palette as a PNG to share.
Frequently asked questions
How do I get a color palette from an image?
Upload any image to this free tool. It analyses the pixels and extracts the most dominant colors, giving you hex, RGB and HSL codes instantly — no account needed.
What algorithm does it use?
Median cut — a method that recursively splits the color space by its widest dimension to find visually distinct colors. It produces more balanced, representative palettes than simple pixel frequency counting.
Is my image uploaded to a server?
No. The entire extraction process runs in your browser using the Canvas API. Your image never leaves your device.
What formats does it support?
JPG, PNG, GIF, and WebP. Any image format your browser can display will work.
How do I use the colors in CSS?
Click Export CSS to get a ready-to-use snippet of CSS custom properties. Paste it into your stylesheet's :root block and reference the colors anywhere in your CSS.