Image Colour Palette Extractor

How to extract a palette

1. Choose/drop a static JPEG/PNG. Inspect oriented dimensions and analysis preview.
2. Choose 3–12 requested colors, ignore transparent pixels or composite over an opaque background, then Extract.
3. Copy individual hex/RGB or all hex codes. Export palette.json with high-precision shares and sampling settings, or palette.css using fixed --palette-1 identifiers. Clear offers Undo; exports invalidate on changes.

Worked alpha example

Opaque red and alpha-128 blue contribute weights 1 and 128/255 in ignore mode: red fraction 255/383 (about 66.58%), blue 128/383 (about 33.42%). Uniform red returns one #FF0000 swatch even when requesting six. Fully transparent ignore samples return No visible colors; composite over white returns white.

Deterministic sampling and clustering

Browser EXIF orientation is applied once. The longest analysis edge is at most 256 px with no upscaling; proportional dimensions round to the nearest pixel. Canvas resampling can introduce intermediate colors. Fractions measure analyzed sample weight, not exact original file pixel counts.

Identical RGB values are aggregated first. Weighted Euclidean sRGB k-means seeds the highest-weight point (lexicographic RGB tie-break), then maximizes weight × squared distance to the nearest center with deterministic ties. Assignments use first-center tie-break; weighted centroids run at most 20 iterations or until maximum squared movement ≤0.0001. Empty clusters are removed. Rounded duplicate RGB centers merge weights; output sorts descending fraction, hex ties. This pragmatic RGB distance is not perceptually uniform.

Transparency, accuracy and limits

Ignore mode excludes alpha zero and weights stored RGB by exact alpha/255. Composite mode calculates source-over channels, rounded nearest integer half-up over the chosen opaque background, then weights all pixels equally. Transparent hidden RGB can be lost during decoding; we do not recover it. Colors are representative browser-decoded sRGB, not print measurements, exact brand colors or the most visually important subject.

15 MiB, 20 megapixels, 8192 px edges. Header/container checks reject unsupported, animated and corrupt files. Decoder allocations can still fail; errors preserve the previous image. One bounded 256px analysis remains, workers cancel obsolete jobs and bitmaps/URLs are released. No third-party upload, profile preservation or cross-browser identical extraction guarantee. Palette membership says nothing about accessible contrast; check chosen foreground/background pairs separately.