Image Blur
Apply a Gaussian-style blur with adjustable radius up to 20px.
Blur an image with a sliding radius from 0 to 20 pixels. Useful for hero backgrounds, censoring sensitive content, or producing soft variants of UI screenshots. The blur is applied via ctx.filter and saved as PNG, all locally in your browser.
Common use cases
- Blur backgrounds for hero banners and login splash screens
- Censor faces, license plates or sensitive info before sharing screenshots
- Create soft, frosted-glass variants of photos for design mockups
- Generate placeholder images while a higher-res asset loads
Frequently asked questions
What kind of blur is this?▾
It uses the browser's native ctx.filter blur(), which is a Gaussian blur. The radius is in CSS pixels — at the source resolution, not viewport resolution.
Can I blur only part of an image?▾
Not in this tool — for that, crop the area first and re-composite. This tool blurs the whole image.
Does the blur preserve transparency?▾
Yes. PNG output keeps the alpha channel intact, with the blur applied to RGBA pixels.
Related tools
🖼️
Image Format Converter (PNG ↔ JPG ↔ WEBP)
Convert images between PNG, JPG and WEBP entirely in your browser.
🗜️
Image Compressor
Reduce image file size with adjustable quality, preview before saving.
📐
Image Resizer
Resize images to exact pixel dimensions or by percentage.
🔁
Image to Base64
Encode an image as a Base64 data URI for inline embedding.