Image Color Palette Generator

Upload a JPG, PNG or WebP to extract a compact set of colors locally, then copy HEX codes or save a palette image.

Estimated Result

—

Enter values and calculate.

Clear controls

Review inputs and results

Transparent methods

Understand the output

Works on any device

Mobile, tablet or desktop

How to Use the Image Color Palette Generator

Choose an image or drag it onto the upload area. Files must be JPG, PNG or WebP, nonempty and at most 10 MB. Choose 5–10 requested colors. The image preview and swatches update after analysis. Copy individual colors or the full list, download a PNG palette, or reset to release the image and start again.

Formula and Explanation

Decode locally → resize to a maximum 256-pixel side
Group sampled RGB values in 16-level channel bins
Weight each sample by alpha; ignore fully transparent pixels
Choose distinct weighted seeds → eight deterministic clustering passes
Merge close cluster colors → sort by represented sample weight

The method averages nearby RGB samples, chooses separated initial colors and refines their groups. Colors less than 24 units apart in ordinary RGB Euclidean distance are grouped to reduce near-duplicate shades. HEX values describe the resulting rounded RGB colors, and shares describe sampled alpha-weighted pixels, not semantic importance or exact full-resolution coverage. A solid or low-diversity image returns fewer colors than requested rather than inventing extra ones.

No image is uploaded or sent to an external API. Browser decoding and resizing can vary slightly between platforms; identical sampled RGBA data produces identical extraction results. Semi-transparent samples retain their RGB color with alpha weighting, rather than being composited onto white. Decoded images above 40 million pixels or a 16,000-pixel side are rejected to limit resources. Animated images contribute a decoded still frame. This is separate from the existing Color Palette Generator, which creates combinations without uploading an image.

Worked Example

An opaque test image with equal red, green and blue blocks produces #FF0000, #00FF00 and #0000FF, even when five colors are requested. Fully transparent pixels do not add an invisible background color. JPEG compression and resized edges can introduce intermediate shades; output is a sampled approximation, not a list of every original pixel value.

Frequently Asked Questions

Is my image sent to a server?

No. File decoding, sampling, color extraction and PNG creation happen in this browser. Reset releases the preview URL; no account or upload endpoint is used.

Why did I get fewer than five colors?

The image may contain fewer distinct visible colors. Similar groups are merged, so a flat logo or a solid background can produce fewer than the requested count.

How are transparent images treated?

Fully transparent pixels are ignored. Other pixels are weighted by alpha and use their stored RGB values, so invisible RGB data cannot dominate the palette.

Will copied colors match a printed image?

HEX codes describe sampled screen RGB colors. They do not provide printer-specific CMYK conversion or ICC color management. Compression, sampling and device profiles can affect the apparent match.