Find the Average Color of an Image
Drop in any image and get its single average color, the one tone that blends every pixel together. The tool samples the photo in your browser, averages the red, green and blue channels across the opaque pixels, and shows the result as hex, RGB and HSL. It also tells you the perceived brightness, whether black or white text reads better on top of it, and the complementary color. Everything runs on your device, so the image never leaves it.
How to find an image's average color
- Drop an image in, or click to browse.
- Read the average color as hex, RGB and HSL.
- Click any value to copy it, or copy the complementary color.
Examples
Pick a background tint from a hero photo
A landscape photo
One average hex code, plus its RGB, HSL, brightness and complement
Frequently asked questions
Is my image uploaded anywhere?
No. The image is sampled and analyzed entirely in your browser. It never leaves your device, so private images stay private.
How is the average color calculated?
The tool samples the image to a small size for speed, then averages the red, green and blue channels across every pixel that is not transparent. The mean of each channel is the average color.
Why is the average color often a muddy or grey tone?
Averaging mixes every pixel together, so a colorful photo tends toward a neutral middle tone. If you want the prominent colors instead of one blend, use the image color palette extractor.
What do brightness and readable text color mean?
Brightness is the perceived luminance of the average color on a 0 to 255 scale. Readable text color is whether black or white text has more contrast on top of that color, useful for choosing label text.
What is the complementary color?
It is each channel inverted (255 minus the value), which gives the opposite color. It is a quick starting point for an accent that contrasts with the average tone.
Related tools
Image Color Palette Extractor
Extract the dominant color palette from any photo in your browser. Get ranked hex codes, copy as CSS variables, and download. Nothing is uploaded.
Image Color Picker
Pick the exact color of any pixel in an image and get its hex, RGB, and HSL values. Hover to preview, click to lock. Runs in your browser, nothing uploaded.
Image Filters and Effects
Apply grayscale, sepia, invert, brightness, contrast, and saturation to an image with live preview. Free, private, and runs in your browser.
Add Border to Image
Add a colored border or frame around an image, with adjustable width and color. Live preview, runs in your browser, nothing uploaded.
APNG Detector
Check whether a PNG file is an animated PNG (APNG) in your browser. See the frame count, loop count, and dimensions read straight from the file. Private.
Blur Image
Blur a whole image or drag a box to blur a face, name, or address. Adjustable blur strength, live preview, runs in your browser. Nothing is uploaded.