Generating a color spectrum for an image

The problem

It has been reported that Amanda Hinton set out to solve a deceptively simple question: how do you show someone all the colors in a photograph — not just the big hits, but every tint, shade and subtle variation? The result is Spectrimage, an analyzer for Chromaculture that extracts and displays an image’s color composition. What starts as a lovely visualization problem quickly turns into an exercise in algorithmic humility: classic tools for compressing images don’t always do what you want when the goal is honest representation rather than efficient storage.

Iterations and lessons learned

Hinton’s first try used median-cut quantization — a vintage compression trick that looks tidy on paper. But median cut equalizes bucket sizes and throws away frequency information, so an orange that fills 60% of a photo can be rendered as just one of thirty-two equal swatches. Next came a hue histogram in HSL space, which fixed ordering (ROYGBIV, at last) and gave bins proportional to pixel count. Better. But five-degree bins smoothed away meaningful lightness variation; dark and sunlit oranges collapsed into muddy averages.

She then dumped bins altogether and tried a pixel-level sort after downsampling, chunking adjacent sorted pixels into hundreds of segments. The spectrum grew detailed — and noisy. Why the barcode effect? Sorting by hue alone left dark and bright pixels adjacent; chunking produced alternating strips. Band sorting (ROYGBIV bands sorted dark-to-light) and degree-level sorting (each integer hue sorted by lightness) calmed some transitions but introduced periodic discontinuities: each sub-sort resets at the next hue and the striping returned. Frustration peaked — you can almost feel the “close but no cigar” moment.

A pragmatic pivot

It has been reported that Hinton moved away from DOM-heavy rendering toward canvas-based approaches with smoothing to attack the striping at its visual root, trading per-segment flexibility for continuous rendering fidelity. The bigger takeaway: visualization and compression are different beasts. Algorithms that reduce color counts intentionally flatten nuance; to show nuance, you need frequency-aware ordering and rendering that respects both hue and perceived lightness — and sometimes you just have to reinvent the wheel. Spectrimage is a reminder that design tools live in messy middle ground: part art, part math, and occasionally, a little stubbornness.

Sources: amandahinton.com, Hacker News