Extract palette from an image — all processing happens in your browser.
Click or drag & drop an image to extract colors
Extract palette from an image — all processing happens in your browser.
Click or drag & drop an image to extract colors
Pick a base color using the color picker or type a HEX value.
Choose a harmony rule (Complementary, Analogous, etc.).
Click Generate to create a 5-color palette.
Click a swatch to copy its HEX code, or export all as CSS/JSON.
Complementary, analogous, triadic, tetradic, split-complementary, and monochromatic palettes based on color theory.
Upload any photo and extract the 5 dominant colors using browser-based canvas sampling. Completely private.
Export palettes as a HEX list, CSS custom properties ready to paste into your stylesheet, or structured JSON.
No server, no file upload, no registration. Works offline once the page is loaded.
A color palette is a set of colors chosen to work harmoniously together. In design, palettes typically consist of 3 to 7 colors and follow color theory rules such as complementary, triadic, or analogous relationships.
Complementary colors sit opposite each other on the color wheel, creating high contrast. Analogous colors are adjacent on the wheel, creating smooth, harmonious combinations with low contrast.
Yes. Drag and drop or upload any image in the second panel. The tool samples pixels across the image using HTML Canvas and clusters similar colors to identify the 5 most dominant hues. Everything runs in your browser — no image is ever uploaded to a server.
Click 'Copy CSS Variables' to copy a :root { } block with --color-1 through --color-5 variables. Paste it into your CSS stylesheet and reference colors with var(--color-1) etc.