Image Histogram Viewer

An image histogram is a graphical representation showing the distribution of pixel brightness values across an image. The horizontal axis represents brightness levels from 0 (pure black, left) to 255 (pure white, right), while the vertical axis shows how many pixels exist at each brightness level. A well-exposed photograph typically shows a histogram that spans most of the range with a roughly bell-shaped distribution. A left-heavy histogram indicates an underexposed (dark) image with most pixels in the shadow region. A right-heavy histogram suggests overexposure with most pixels in the highlights. Clipping — tall spikes at the extreme left or right edges — indicates pure black or pure white areas where detail is lost and cannot be recovered. RGB channel histograms show separate distributions for red, green, and blue channels, revealing color balance information. If one channel is shifted significantly compared to others, the image has a color cast that may need correction. The Canvas API enables histogram calculation by reading every pixel in the ImageData array and counting the occurrence of each brightness value — all processing happens locally in your browser.

Histograms are diagnostic tools that inform editing decisions before you make them. Check the histogram before adjusting brightness, contrast, or color — it tells you objectively what the image needs rather than relying on subjective visual assessment on a potentially uncalibrated monitor. For underexposed images (left-heavy histogram), you know brightness increase is needed and can gauge how much headroom exists before highlights clip. For overexposed images (right-heavy with right-edge clipping), the histogram reveals whether highlight detail is recoverable — clipped pixels are permanently white and cannot be darkened to reveal detail. For low-contrast images (histogram compressed into a narrow central range), contrast adjustment will spread the distribution across the full tonal range, adding depth and visual impact. White balance issues appear as misaligned RGB channel histograms — if the blue channel is shifted right relative to red and green, the image has a cool (blue) cast. Professional photographers compare histograms before and after editing to verify their corrections achieved the intended result without introducing new problems like clipping or color shifts.