Convert an image to grayscale
Turn photos black and white, sepia or negative, and fine-tune brightness, contrast and saturation with a live preview. Free and fully local.
- Runs in your browser
- Files are never uploaded
- Free, no account
How to convert an image to black and white
- Drop one or more images onto the box above.
- Pick a preset — Grayscale, High-contrast B&W, Sepia, Vintage, Faded, Invert or Punchy colour — or go straight to the sliders.
- Adjust grayscale, sepia, invert, brightness, contrast and saturation while watching the live preview.
- Press Apply to render every image at full resolution, then download them individually or as a ZIP.
The maths behind a good grayscale conversion
Averaging red, green and blue is the obvious way to desaturate an image, and it is wrong. The
eye is far more sensitive to green than to blue, so a plain average makes foliage look muddy and
skies look unnaturally bright. This tool uses the Rec. 709 luma coefficients, the same ones used
by HDTV, sRGB and CSS filter: grayscale():
Y = 0.2126 · R + 0.7152 · G + 0.0722 · B
Green carries roughly 71% of perceived brightness, red 21% and blue 7%. The result matches how a scene looks to you with the colour turned off, which is why it reads as a proper black-and-white photograph rather than a washed-out colour one.
What each slider does
| Slider | Neutral | Effect |
|---|---|---|
| Grayscale | 0% | Blends each pixel towards its luma value; 100% is fully monochrome |
| Sepia | 0% | Applies the classic warm-brown matrix, mimicking toned darkroom prints |
| Invert | 0% | Turns each channel into 255 − value; 100% is a photographic negative |
| Brightness | 100% | Multiplies every channel, lifting or lowering the whole image |
| Contrast | 100% | Pushes values away from mid-grey (128), widening the tonal range |
| Saturation | 100% | Scales the distance of each channel from luma; 0% is grayscale |
They are applied in a fixed order — brightness, contrast, saturation, grayscale, sepia, invert — matching the way a CSS filter chain composes, so the presets here produce the same result you would get from the equivalent CSS or a design tool.
Making a black-and-white photo look good
- Add contrast. Colour separates subjects for you; without it, an image can look flat. 115–145% contrast is a typical starting point for monochrome.
- Watch the highlights. Pushing brightness above about 115% clips bright areas to pure white, and that detail cannot be recovered.
- Try partial desaturation. Grayscale at 70–85% leaves a hint of colour that often reads as more filmic than a total conversion.
- Sepia is a tone, not an age filter. 40–60% sepia over a full grayscale conversion looks like a toned print; 100% over a colour image just looks orange.
Practical uses
- Neutralising a mixed set of headshots so a team page looks consistent.
- Preparing artwork for single-colour printing, laser engraving or embroidery digitising.
- Reducing distraction in screenshots and diagrams used inside documentation.
- Checking that a design still has enough tonal contrast to be legible to colour-blind readers — drop saturation to 0% and see whether the elements still separate.
- Creating a negative from a scanned film strip with the invert slider.
Transparency and file size
The alpha channel is never touched, so transparent PNGs stay transparent all the way through. Grayscale images also compress better than colour ones — there is less chroma information to store — so expect a monochrome JPEG to be roughly 10–25% smaller than the colour original at the same quality. Run it through compress image afterwards to bank that saving.
Questions
How is the grayscale value calculated?
Each pixel is converted with the Rec. 709 luma weights — 0.2126 red, 0.7152 green, 0.0722 blue. Those weights match how the human eye perceives brightness, so greens stay bright and blues stay dark, exactly as a proper black-and-white conversion should look.
In what order are the adjustments applied?
Brightness, then contrast, then saturation, then grayscale, then sepia, then invert — the same order a CSS filter chain uses. That means the presets here produce the same result you would get in a design tool.
Does it work on transparent PNGs?
Yes. The alpha channel is left untouched, so transparency is preserved through every adjustment and the exported PNG or WebP keeps its transparent areas.
Can I apply one look to many photos?
Yes. Set the sliders once using the live preview of the first image, then apply the same treatment to the whole batch and download a ZIP.