100% Client-Side • Images never leave your device
Extract Colors from Any Image
Upload an image and extract its dominant colors instantly. Export as CSS variables, Tailwind config, or hex codes.
🎨
Drop an image here or click to upload
PNG, JPG, WebP
100% client-side. Your images never leave your device.
Features
Smart K-Means Extraction
Uses K-means clustering to identify dominant colors from your image. Adjust the number of colors from 3 to 12 for the perfect palette.
Developer-Ready Export
One-click export as CSS custom properties, Tailwind config, or plain hex codes. Download a JSON file for use in any design tool or workflow.
100% Browser-Based
All color extraction happens locally in your browser. No server uploads, no accounts. Your images stay private on your device.
FAQ
How does the color extraction work?+
The tool uses a K-means clustering algorithm to group similar pixels in your image and identify dominant colors. It samples pixels efficiently for fast results even on large images.
What image formats are supported?+
You can upload PNG, JPG, and WebP images. Simply drag and drop or click to select a file from your device.
Can I adjust the number of colors?+
Yes. Use the slider to choose between 3 and 12 colors. After adjusting, click Re-extract to generate a new palette with your chosen count.
What export formats are available?+
You can copy all hex codes, export as CSS custom properties (--color-1, --color-2, etc.), copy a Tailwind config colors object, or download the palette as a JSON file.
Is my image uploaded to a server?+
No. All processing happens entirely in your browser using the Canvas API. Your image never leaves your device. No data is sent to any server.