Image Palette Builder
Build a 1–20 colour palette by sampling an image, then export CSS, code, SVG or PNG. Processing takes place locally in your browser.
Start using
Image Palette Builder
Sampling uses a canvas reduced to at most 1050×720 pixels, not the original full-resolution coordinates. Resampling, browser colour conversion and compression can affect the values. Alpha is not included in the palette: RGB is exported as opaque colour.
A solid red image starts with ten repeated #FF0000 entries at the default capacity. There is no deduplication, dominant-colour clustering or automatic guarantee of a balanced palette. Select meaningful regions manually.
Increasing capacity leaves existing entries unchanged; it does not automatically fill new slots. Decreasing capacity removes entries from the end. New picks at full capacity remove the oldest entry. Only the latest pick marker remains visible.
CSS exports valid :root custom properties such as --color-ff0000: #ff0000; with SCSS references inside comments. Code provides a comma-separated list and an array without # prefixes. SVG and PNG are palette graphics, not copies of the source image.
One image is processed locally, limited to 25 MiB and 24 million decoded pixels. Clear removes the image and colours and restores capacity 10. A replacement image keeps the chosen capacity and starts a new random sample.
Processing takes place locally in your browser.