About Image Grayscale

Desaturate any image — 0–100% grayscale, preview + download. Part of the DevTools Surf developer suite. Browse more tools in the Images collection.

Use Cases

• Web designers creating monochrome hero images for minimalist layouts
• Photographers previewing black-and-white versions of color photos
• Print designers converting images for single-color publication printing
• UI developers generating disabled or placeholder state image variants

Tips

• Adjust the desaturation slider from 0 to 100% for partial grayscale effects
• Preview the grayscale result before downloading the processed image
• Use partial desaturation (50-70%) for a muted, vintage photo aesthetic

Fun Facts

• True grayscale conversion weights RGB channels differently: 29.9% red, 58.7% green, 11.4% blue — matching the human eye's sensitivity curve defined by the ITU-R BT.601 standard.
• The first digital grayscale image was scanned in 1957 by Russell Kirsch at the National Bureau of Standards — a 176x176 pixel photo of his infant son, now in the Smithsonian.
• Instagram's original 'Inkwell' filter (2010) was essentially a grayscale conversion with slight contrast boost — it was one of the app's first and most popular filters.

FAQ

Which grayscale formula?

ITU-R BT.709 weighting (0.2126R + 0.7152G + 0.0722B) by default — matches how the human eye perceives brightness. Toggle to older BT.601 (0.299R + 0.587G + 0.114B) or simple average.

What's the 0-100% slider?

Partial desaturation — 0% is full color, 100% is full grayscale, 50% is half-desaturated (muted but still color). Useful for faded-photo effects.

Does it reduce file size?

Only if you save as grayscale PNG/JPEG (8-bit vs 24-bit). Otherwise the file has three identical channels.

Can I preserve specific colors?

This tool is fully desaturated. For selective color (old tourist-photo effect where one object stays colorful), use Photoshop or GIMP.