This free online tool generates image histograms for red, green, blue, and greyscale values. Histograms can be generated for multiple images at once in batch.
You can also export the values into a csv file for further analysis in your spreadsheet application.
Note: All processing is done on the client side. That means your images are not transferred to the server.
If you you're an Android enthusiast that likes to learn more about Android internals, I highly recommend to check out my Bugjaeger app. It allows you to connect 2 Android devices through USB OTG and perform many of the tasks that are normally only accessible from a developer machine via ADB directly from your Android phone/tablet.
How This Tool Works
An image histogram displays pixel value distribution within an image.
This tool basically creates 256 bins for each color (red, green, blue) and greyscale (luma) intensity. The number of bins is shown on the horizontal axis.
The tool then loops through every image pixel and counts the occurrence of each intensity. The counts of occurrences in each bin are then displayed on vertical axis.
Counts for each pixel intensity are normalized to range 0 to 255 before they are displayed on the graph.
I used JavaScript in combination with WebAssmebly to create this tool.
How Are Greyscale Values Calculated
I'm using the following formula to convert red, green, and blue values to greyscale
luma = 0.299*red + 0.587*green + 0.114*blueStatistics Explained
The optional statistics provide a quick numerical summary of the image's tonal range for each channel. All stats are calculated from the raw, non-normalized pixel counts.
- Mean: Represents the average intensity (brightness) of the pixels.
- Median: The middle intensity value. Half the pixels are brighter than this value, and half are darker. It's less affected by a few extremely bright or dark spots than the mean.
- Std. Deviation: Measures the contrast. A low value indicates a low-contrast image where intensities are clustered together, while a high value indicates a high-contrast image with a wider spread of intensities.
Clipping
The clipping indicator provides a warning about potential data loss in your image. A red triangle appears on the far left of the graph to indicate "crushed blacks," meaning detail has been lost in the darkest shadows (pixel value 0). Similarly, a triangle on the far right warns of "blown highlights," where detail is lost in the brightest parts of the image (pixel value 255).
From Analysis to Creation
While analyzing your histograms, you might notice a common challenge: a single exposure often struggles to capture a scene's full dynamic range, leading to the very clipping in highlights and shadows this tool helps you identify. To overcome these limits, photographers use High Dynamic Range (HDR) techniques to merge multiple bracketed shots. If this is a problem you encounter, my mobile app Mergius is designed specifically for this workflow, allowing you to combine your exposures and use advanced tonemapping to gain precise control over the final tonal distribution.
Useful links
If you want to know how to generate and show image histogram on Android, you can check out my blogpost where I'm giving more technical details about this topic
I also created some other tools related to photography and image processing. If you'd like to automatically stitch multiple overlapping photos, you can check out my tool that I've created for web and for Android
https://play.google.com/store/apps/details?id=eu.sisik.panotool
You are allowed to use the generated histogram graph images and data freely for any commercial or non-commercial purposes, and you also don't need to give attribution (although linking back to my site is always nice ;D).
