Result will appear here.
Build an approximate 1–32 colour palette from an image — export CSS variables, in your browser.
Groups similar pixels from a whole-image canvas sample and returns the most common buckets as a palette with percentage shares.
Set any count from 1 to 32; fewer may be returned if the image has fewer distinct buckets.
Swatch text is light or dark based on luminance, with an accessible colour name.
Everything runs in your browser on a canvas — your image is never uploaded.
Image Color Palette Generator builds an approximate colour palette from your image by grouping similar pixels from a whole-image canvas sample and returning the most common buckets, each with the share of analysed pixels it covers. Choose how many colours you want, from one up to thirty-two.
An adjustable grouping level controls how aggressively close shades are merged, and you can ignore transparent pixels, alpha-weight them, or include them all. Each swatch is labelled and uses automatic light-or-dark text so the HEX stays readable on any colour.
It is a fast quantised palette, not a perceptual clustering algorithm such as k-means, and the colours come from the browser-rendered sRGB canvas rather than the raw file bytes. Export the palette as TXT, JSON, CSS variables or CSV, or copy all colours at once.
Generate anywhere from 1 to 32 colours instead of a fixed count.
Buckets come from a full-coverage sample with the aspect ratio kept, not a cropped square.
Each swatch auto-picks light or dark text and carries an accessible colour label.
Download TXT, JSON, CSS variables or CSV, or copy every colour at once.
Pull a starting palette from a moodboard or product photo.
Export :root custom properties straight into a stylesheet.
Capture the recurring colours of an illustration or UI screenshot.
Summarise an image's colours with percentage shares.
It groups similar browser-rendered pixels from a whole-image sample into buckets and returns the largest buckets as the palette, with each colour's share of analysed pixels. It is a fast quantised approximation, not a perceptual clustering method like k-means.
Yes. The palette-size control accepts any whole number from 1 to 32. If the image has fewer distinct buckets than requested, the result details note how many colours were actually found.
Yes. Choose the CSS export to download a :root block of --color-1, --color-2 and so on as custom properties, or copy all the HEX values at once. TXT, JSON and CSV exports are also available.
Each swatch picks black or white text automatically from the colour's luminance, so the HEX label stays readable on both light and dark colours. Swatches also carry an accessible colour label.
They are read from the browser-rendered sRGB canvas, not the raw file bytes, so embedded profiles, CMYK source data or HDR may shift them. No image is uploaded to build the palette.
Tools that pair well with Image Color Palette Generator.