Grayscale Image

Upload an image, convert its pixels to grayscale in the browser, preview the result, and download the processed file locally.

Result
Waiting for image

The image was converted to grayscale locally with Canvas and ImageData.

Source Size
0 B
Output Size
0 B
Width
N/A
Height
N/A
Original Preview
Upload an image to preview the original.
Grayscale Preview
Upload an image to preview the grayscale result.

How The Tool Works

The browser draws the uploaded image onto a canvas and reads the raw pixel buffer through ImageData.

Each pixel is converted to a luma-weighted grayscale value, then the canvas is exported back into a browser-supported image format for download.

Quick Examples

Grayscale conversion is useful for print previews, mood boards, and contrast checks.
Local canvas processing is useful when you want to avoid uploading images to a server.
Side-by-side previews are useful when you want to compare the original and grayscale output quickly.
A grayscale export is useful for presentations, documentation, and simple image studies.

Frequently Asked Questions

Does this upload my image anywhere?

No. The conversion happens locally in the browser with Canvas and object URLs.

Will the image dimensions change?

No. The tool keeps the original width and height and only changes pixel colors.

Why can file size change?

Re-encoding the processed image can change compression details, which affects the final file size.

What image formats can I use?

Any image format the browser can decode and draw on a canvas should work here.

Useful Notes

Grayscale conversion reduces color information, but it does not crop or resize the image.

Canvas-based image transforms are a good fit for quick browser utilities with immediate previews.

The luminance formula weights green more heavily than red or blue to better match perceived brightness.

Related Tools