How to adjust image brightness, contrast, and saturation

Most photos don’t need heavy editing. They need a nudge: a dim room made legible, a flat sky given some depth, a busy background softened. This guide explains what each slider actually does to the numbers inside your image, so you can make that nudge on purpose instead of by trial and error.

Everything here uses the Adjust colors and filters tool, which runs in your browser. Your photo is processed on your device and never uploaded.

What do brightness, contrast, and saturation actually change?

A typical photo stores each pixel as three numbers, one each for red, green, and blue, from 0 (none) to 255 (full). Every tone slider is a small formula applied to those three numbers, pixel by pixel. Knowing the formula tells you what the slider can and cannot fix.

The tone adjustments run in a fixed order: brightness first, then contrast, then saturation. That order matters. If you raise brightness by a lot, contrast then stretches values that are already near the top, which makes highlights clip sooner than you might expect.

How to adjust image brightness without losing detail

Brightness in Image Edtr is an offset. A setting of 20 adds 20% of 255, about 51, to every channel of every pixel. A shadow at 40 becomes 91, a midtone at 128 becomes 179, and a highlight at 230 would become 281. There is no 281, so it is stored as 255.

That last step is clipping. Once several neighboring pixels all land on 255, the subtle differences between them are gone. A cloud that had texture becomes a flat white patch, and no later slider can bring the texture back, because the information isn’t in the file anymore. The same thing happens at the bottom end when you lower brightness: everything below the offset collapses to 0, pure black.

• Start small. Try 10 to 20 first. Most underexposed phone photos only need that much.
• Watch the brightest area, not the subject. Skin, sky, and white shirts are where clipping shows first.
• Pair a brightness lift with a little contrast. An offset raises the dark end too, so shadows can look gray and washed out. A touch of contrast pulls them back down.
• Keep the original. Adjustments are applied to a copy. Download the result under a new name so you can always start over.

How to read a histogram

A luminance histogram is a bar chart of brightness. The horizontal axis runs from black on the left to white on the right. Each bar’s height shows how many pixels in the image have that brightness. It doesn’t show where those pixels are, only how many there are at each level.

• A tall wall at the left edge means many pixels are pure black. Shadow detail has been clipped.
• A tall wall at the right edge means many pixels are pure white. Highlights have been clipped.
• Everything bunched on the left is a dark, underexposed image. Everything bunched on the right is bright or overexposed.
• A narrow hump in the middle with empty space on both sides is a low-contrast, hazy image. Contrast spreads that hump out.
• Gaps and spikes (a comb-like shape) appear after strong edits. They mean nearby tones have merged, which can show up as banding in smooth gradients like skies.

There is no correct histogram shape. A night scene should lean left and a snowy field should lean right. What you’re checking is whether a change you made pushed a lot of pixels into either wall. If it did, back the slider off until the wall shrinks.

How do I increase contrast of a photo?

Contrast in Image Edtr scales each channel around mid-gray. Positive values multiply the distance from 128 by up to 3×; negative values shrink it, and −100 reduces every pixel to flat gray. Values that start at 128 don’t move, which is why contrast changes feel anchored in the midtones.

A worked example makes the limit clear. At contrast 50 the multiplier is 2×. A pixel at 64 becomes (64 − 128) × 2 + 128 = 0, and a pixel at 192 becomes 256, stored as 255. So at contrast 50, anything darker than 64 or brighter than 192 clips. On a hazy landscape whose values sit between 70 and 180, that is fine. On a photo that already uses the full range, it throws away a lot of shadow and highlight detail.

How to change saturation, or make a photo black and white

Saturation works on each pixel’s distance from its own gray. For every pixel, Image Edtr computes a luminance value, then moves the red, green, and blue channels toward that gray (negative saturation) or away from it (positive saturation). At 100, colors sit twice as far from gray as they did. At −100, they land exactly on it.

Strong positive saturation clips in its own way. A bright red flower already near 255 in the red channel has nowhere to go, so neighboring reds merge into a single flat shade. If petals lose their texture, reduce saturation until you can see the folds again. Skin tones are also sensitive; anything past about 30 tends to look sunburned.

To make a photo black and white, tick Grayscale. It doesn’t simply average the three channels. It uses the Rec. 709 luminance weights: 0.2126 × red + 0.7152 × green + 0.0722 × blue. Those weights follow how bright each color looks to the human eye, which is why a green field turns light gray and a deep blue sky turns fairly dark. A straight average would make blue look much lighter than it feels.

Black-and-white photos usually benefit from extra contrast, because color is no longer separating objects. In the photo editor, the Mono preset combines grayscale with a small contrast boost, and Noir uses much stronger contrast with a slight darkening.

How to fix a dark photo

A dark photo is the most common reason people reach for these sliders. The fix depends on whether the image is dark everywhere or only in the shadows, and the histogram tells you which.

1. Check the histogram. If it’s bunched on the left but doesn’t touch the right edge, there’s room to brighten.
2. Raise brightness gradually until the main subject is easy to read. Stop if a bright area such as a window starts to blow out.
3. Add a little contrast, around 10 to 20, to restore depth to shadows that the offset lifted toward gray.
4. Nudge saturation up slightly if colors look dull. Brightening often makes color feel weaker.
5. Apply and compare with the original before downloading.

When should you sharpen or blur an image online?

Sharpen in Image Edtr is a 3×3 Laplacian. For each pixel it takes four times its own value, subtracts its four direct neighbors, and adds that difference back, scaled by the amount (0 to 100). On flat areas the difference is close to zero, so nothing changes. At edges the difference is large, so light sides get lighter and dark sides get darker. That is what reads as crispness.

Sharpening can’t recover focus that was never captured. It increases edge contrast, so a soft photo looks crisper, but a badly blurred one just gets halos: bright outlines along dark edges. The best time to sharpen is after shrinking an image, since downscaling softens edges slightly. See how to resize images for that step. Start around 20 to 40 and zoom to 100% to check for halos.

Blur goes the other way. Image Edtr runs a box blur, averaging each pixel with its neighbors within the chosen radius, three passes in a row. Three passes of a box blur closely approximate a Gaussian blur, and the cost stays the same however large the radius is. The radius goes from 0 to 20 px, so the same setting looks stronger on a small image than on a large one.

• Blur 1–2 px: softens noise or harsh texture without an obvious effect.
• Blur 5–10 px: turns a photo into a soft background for text or a slide.
• Blur 15–20 px: hides detail almost completely. Note that for genuinely sensitive information, such as a document number or a face, covering it with a solid shape is more reliable than blur.

When both are set, blur is applied before sharpen. In practice you’ll rarely want both on the same image.

How to adjust a photo in Image Edtr

1. 1

   Choose an image

   Open Adjust colors and filters and drop in a JPEG, PNG, WebP, GIF (first frame), BMP, or AVIF if your browser can decode it.

2. 2

   Move the sliders

   Set Brightness, Contrast, Saturation, Blur, and Sharpen, or tick Grayscale. The preview updates as you drag. Use Reset to return to neutral.

3. 3

   Select Apply

   Apply renders the exact pixels. The live preview uses browser CSS filters, so it is a close approximation rather than the final result.

4. 4

   Compare and download

   Check the result against the original, choose JPEG, PNG, or WebP, and download.

Filters run in a background worker where the browser supports it, so the page stays responsive. Blur and sharpen on very large photos can still take a few seconds.

Choosing an output format after adjusting

Saving an adjusted image re-encodes it. That has two consequences worth knowing. First, the new file doesn’t carry over the original’s metadata, such as camera settings or location. Second, the format you pick affects quality and size.

For more on the trade-offs, read the image formats guide. If the file is still too large after editing, run it through compression as a final step.