Blur image backgrounds with center focus or edge vignette — 100% in your browser
Upload an image to see the preview
Background blur uses the Canvas API Gaussian blur filter. This is not AI-based background removal. Results depend on browser capabilities. All processing is local.
This tool emulates a shallow depth-of-field look without any lens. It builds a low-resolution elliptical alpha mask — an ImageData buffer where each pixel's alpha encodes how strongly the background should show through — then renders the photo with the CSS blur(radius) filter, which applies a fast box/ gaussian approximation over a kernel of the chosen radius (2–50 px). In Center Focus mode the sharp ellipse is composited back on top of the fully blurred frame; in Edge Vignette mode only the region outside the ellipse is blurred. The mask is computed at 25% resolution and upscaled with high-quality smoothing, so even a 6000 px image stays responsive while you drag the sliders.
A 20 px blur radius spreads each pixel into roughly a 20 px disc. The mask's smooth 0→1 transition — a linear ramp in Center Focus, a smoothstep in Edge Vignette — is what hides the seam between sharp subject and soft background.
Liam photographs a colleague for a company headshot against a busy office background, and wants a clean portrait look without an expensive f/1.4 lens.
To blur a background: upload your image — the AI segments the subject and applies a blur effect to the background, all processed locally in your browser.
FreeToolHub Background Blur is a free browser-based tool that blurs image backgrounds using AI, no signup, no upload.
Add DSLR-quality background blur to photos. No app, no upload, runs fully in your browser.
Image Background Blur recreates the shallow-depth-of-field look of a DSLR portrait lens without any subject cutout. You upload a photo, and the tool keeps a central elliptical region tack-sharp while blurring everything around it, guided by two sliders: Blur Strength from 2 to 50 pixels (20 by default) and Focus Area from 10% to 90% of the frame (40% by default). Two rendering modes change the character of the effect: Center Focus cuts a crisp elliptical subject window over the blur, while Edge Vignette fades the blur in through a much wider, softer gradient. A before/after comparison slider previews the effect live, and the export is a full-resolution PNG.
Portrait photographers without a fast lens use it to fake bokeh on headshots taken with kit zooms. Profile-photo perfectionists get LinkedIn, dating-app, and team-page pictures where the background stops competing with the face. Product sellers on Etsy, eBay, and Shopify blur distracting kitchen tables or warehouse shelves behind the item. Real-estate and interior shots benefit when clutter at the frame edges melts away. Because the mask is elliptical and centered, it works best when the subject sits near the middle of the frame; extreme off-center compositions are better served by an AI background remover that traces actual subject outlines, then a blur applied to that mask.
(1) Your photo loads through a FileReader into an image element, entirely inside the tab. (2) The renderer builds an elliptical alpha mask: it is calculated at one-quarter scale, where each pixel's normalized distance from the center decides opacity, then upscaled with high-quality smoothing so the focus boundary becomes a feathered gradient rather than a hard edge. (3) Compositing applies it in one of two orders: Center Focus paints the fully blurred photo first and stamps the sharp original through the center mask; Edge Vignette keeps the sharp base and layers blur through the outer mask using a wide smoothstep falloff. Every slider change re-renders the preview instantly at up to 600 pixels.
No. The live preview is capped at 600 pixels on its longest side purely to keep slider dragging smooth, but the Download Full-Res button re-renders the entire effect onto a canvas sized to your photo's original natural width and height, so a 4000×3000 upload exports as a 4000×3000 blurred-background.png. The tool also displays the source dimensions above the controls, and the before/after comparison keeps that metadata attached. Two practical notes: the Gaussian blur is applied by the browser's Canvas filter engine, so extreme strengths above roughly 40 pixels can visually wash out thin details near the focus edge, and PNG output is lossless, meaning large photos produce large files.
Photoshop's Lens Blur costs $22.99/month and requires manual subject selection. This tool applies Gaussian blur (adjustable radius 1-20px) to your chosen background area in under 2 seconds, producing DSLR-style bokeh depth-of-field. For social media portraits, product shots, and video call backgrounds, the result is visually comparable for web use.
Yes. Adjust blur radius from subtle (2px, slight softening) to heavy (20px, complete background obliteration). Select the subject area to keep sharp, and the tool applies progressive blur to the remainder. Output is full-resolution PNG with no compression artifacts, suitable for Instagram, LinkedIn, or print at 300 DPI.
What do you call a crab that plays baseball?
No paywalls, no signups, no data sold. Built by a solo developer who believes useful tools should be accessible to everyone.
☕Support me on Ko-fi— keep tools free100% of proceeds go towards hosting & building more free tools.