How does the blur work?

The tool sets ctx.filter = "blur(Npx)" on the canvas context before drawing the image, leveraging the browser's native Gaussian blur implementation for fast, hardware-accelerated results.

What radius values are available?

The slider ranges from 0 (no blur) to 50px. A radius of 2–5px gives a gentle soft-focus effect; 20px and above produces a strong blur.

Does blur affect the image dimensions?

No. The canvas dimensions match the original image. However, blur near the edges may show a slight fade because the filter uses edge-clamping.

Image Blur

Apply Gaussian blur to any image with a radius slider using the CSS filter canvas API.

[ choose file ]

Related Tools

lumImage Brightness & Contrast

Adjust brightness, contrast, and saturation of any image using canvas CSS filters.

B/WImage Grayscale

Convert any image to grayscale using pixel-level luminance calculation in the browser.

ZIPImage Compressor

Compress images by adjusting JPEG quality to reduce file size without leaving your browser.

FAQ

How does the blur work?: The tool sets ctx.filter = "blur(Npx)" on the canvas context before drawing the image, leveraging the browser's native Gaussian blur implementation for fast, hardware-accelerated results.
What radius values are available?: The slider ranges from 0 (no blur) to 50px. A radius of 2–5px gives a gentle soft-focus effect; 20px and above produces a strong blur.
Does blur affect the image dimensions?: No. The canvas dimensions match the original image. However, blur near the edges may show a slight fade because the filter uses edge-clamping.

The Image Blur tool lets you upload an image and apply a Gaussian blur effect by setting ctx.filter before drawing. Adjust the blur radius slider from 0 to 50px and see a live preview update. When satisfied, download the blurred image as a PNG. All processing is client-side with no server round-trip.