Adjust image contrast — add punch or soften a photo

Choose a photo and move one slider; positive values push darks darker and lights lighter, negative values pull them both toward middle grey.

Live demo · real result from this tool

Drop images here

or paste with Ctrl+V · nothing is uploaded

Your result appears here — processed on your device.

Processed on your device — nothing is uploaded.

How to use Image Contrast

  1. Choose one or more photos.
  2. Set Contrast from −100% to +100%. The default, +25%, gives a clear but gentle lift.
  3. Pick Save as: the same format as the original, JPEG, PNG, WebP or AVIF, and a Quality for lossy formats.
  4. Press Apply and compare the result with the original.

What it does and when to use it

A photo taken on a hazy day, through a window or of a faded print often looks grey and flat. Raising contrast restores depth. Lowering it does the reverse: it gives a soft, faded, matte look, or tames a harsh midday shot before you add text over it.

Small changes go a long way, and large values clip the brightest and darkest areas. Contrast works well combined with other tools. Fix overall lightness with Image Brightness, lift only the midtones with Image Gamma, or adjust colour strength with Image Saturation.

How it works

The tool builds a 256-entry table from the CSS contrast() formula and applies it to the red, green and blue values of every pixel. With c as the slider value:

output = (v − 127.5) × (1 + c ÷ 100) + 127.5, clipped to 0–255

At +100% the distance from middle grey doubles; at −100% every pixel becomes middle grey. Transparency is not changed. The photo is processed in a background worker in your browser; if you choose AVIF, the encoder downloads from this site the first time. Your photo is never uploaded.

Worked examples

These values come from the tool’s own formula.

  • +25%, a warm pixel (200, 100, 50). Red: (200 − 127.5) × 1.25 + 127.5 = 218.1, so 218. Green becomes 93 and blue 31. The pixel is now (218, 93, 31): lighter lights, darker darks.
  • −30%, the same pixel. It becomes (178, 108, 73), flatter and closer to grey. Pure white drops to 217, and pure black rises to 38, which gives the faded “matte” look.
  • +100%, a light grey (220, 220, 220). It is pushed to 255, pure white. This is the clipping the FAQ warns about.

Limits and tips

  • Middle grey (128) barely moves at any setting; contrast works around it.
  • The change is global. To lift dark midtones while black and white stay fixed, use gamma instead.
  • Saving as JPEG again adds a little compression each time, so edit once and save at a high quality.

Frequently asked questions

What is the difference between contrast and brightness?
Brightness moves every tone up or down together. Contrast changes the distance between tones and middle grey, so darks and lights move in opposite directions. Image Brightness has both sliders if you need to change the two together.
Why have my bright areas turned flat white?
Values above 255 are clipped, so with strong contrast a light sky or white shirt can lose all detail. Lower the slider until texture comes back. The same happens to deep shadows, which clip to black.
Does contrast change the colours?
Each of red, green and blue is stretched the same way, so strong contrast also makes colours look more saturated. If that is too much, follow it with Image Saturation set below 100%.
Will the result match CSS filter contrast()?
Yes. The tool uses the same formula as the CSS Filter Effects specification, so a value of +25% here matches filter contrast(125%), apart from rounding.

Written by the ToolsRift team · Last updated

Pages are drafted with AI assistance and checked by automated tests. How we write and check pages.

Was this tool useful?

Report a problem

Start typing to search every tool.

↑ ↓ to moveEnter to openEsc to close