How to adjust image brightness and contrast
- Drop a photo on the box, click it, paste with Ctrl+V, or click Try a sample photo.
- Drag Brightness, Contrast, Saturation and the other sliders, or start from a quick look such as Black and white. The round arrow beside a slider resets only that slider.
- Switch to Before and after and drag the divider to compare.
- Pick an Output format and click Download adjusted image.
How the adjustments are calculated
Every pixel is converted to red, green and blue values between 0 and 1, run through the filters in a fixed order, and saved again. The formulas are the ones in the W3C Filter Effects specification:
- Brightness multiplies each value by 1 + slider / 100.
- Contrast turns each value v into (v - 0.5) x (1 + slider / 100) + 0.5.
- Saturation, Hue rotation, Sepia and Grayscale mix the three channels with the specification's 3 by 3 color matrices.
- Blur is a Gaussian blur, then Invert turns each value v into 1 - v.
Values are cut off at 0 and 1 after each step, which is why very high brightness turns bright areas flat white.
Worked example
Click Try a sample photo and drag Brightness to 20. The readout shows +20%, and every value is multiplied by 1.2, so an orange pixel of (200, 100, 50) becomes (240, 120, 60) while a value of 230 is cut off at 255. Click Download adjusted image and the status reads Downloaded 1,200 x 800 px, 149.7 KB, JPG. Now click Reset all and Black and white: the readouts show Grayscale 100% and Contrast +15%. Exact file sizes vary slightly by browser.
Limits and edge cases
- Pictures above 40 megapixels are scaled down to 40 megapixels before download, and the status line says so.
- JPEG has no transparency, so see-through areas turn white. PNG and WebP keep them.
- Animated GIFs keep only their first frame. Downloads carry no EXIF data, so GPS location is removed.
- Blur on a large picture takes a few seconds, and the status line shows the progress.
- To change size or crop afterward, use the image resizer or the image cropper. To shrink the file, use the image compressor.
Image color adjuster FAQ
How do I make a photo brighter without losing detail?
Raise Brightness by 10 to 30 and add a little Contrast. Brightness multiplies every pixel, so values above about +50 push highlights to pure white and the detail there cannot be recovered.
How do I turn a photo into black and white?
Click the Black and white preset, or drag Grayscale to 100. Setting Saturation to -100 gives almost the same result. Add a little Contrast afterward to keep the picture from looking flat.
What is the difference between brightness and contrast?
Brightness scales every color value up or down together. Contrast pushes values away from middle gray, which deepens shadows and brightens highlights, or pulls them toward gray when negative.
What does hue rotation do?
Hue rotation turns every color around the color wheel by the number of degrees you choose. At 180 degrees a light blue sky turns peach or orange, and 360 degrees returns the original colors.
Will the downloaded image match the preview?
Yes. The preview and the download use the same calculation in every browser. Pictures above 40 megapixels are scaled down to 40 megapixels before the download, and the status line tells you.
Sources: W3C, Filter Effects Module Level 1.