Image Colour Extractor — Dominant Colours and Palette from Any Image
Extract dominant colours from any image. Get HEX, RGB, and HSL codes. Export as CSS variables or JSON. Canvas-based, no upload required.
Images are analysed entirely in your browser via Canvas API. Nothing is uploaded.
Related Tools
More free utilities you might find useful
Frequently Asked Questions
Quick answers to common questions
How does colour extraction from an image work?+
Colour extraction uses k-means clustering to group image pixels into N representative colours. The Canvas API reads pixel RGBA values, clustered by colour similarity. Runs entirely via Canvas API — no server processing.
What formats does the extracted palette come in?+
This tool outputs HEX codes (web standard), RGB values for CSS, and HSL for design systems. Export as CSS custom properties (--color-1: #hex), JSON object, or a downloadable PNG swatch.
Can I use extracted colours for branding?+
Yes. Colour extraction is used by designers to build cohesive palettes from photography. Extract from your product photos, brand imagery, or inspiration pictures and use the HEX codes directly in Figma, CSS, or design systems.