SVG Blur Filter with feGaussianBlur
feGaussianBlur is the core SVG filter primitive for softening edges, building glow effects, and creating depth-of-field style blur.
Drop your image here
Supports PNG, JPG, BMP, WEBP up to 5MB
Applying a Basic Gaussian Blur
Wrapping an feGaussianBlur primitive inside a filter element and referencing it via the filter attribute on any SVG shape applies a soft blur controlled by the stdDeviation attribute, with higher values producing a stronger blur — the same core primitive used internally by many more complex effects like drop shadows and glows.
- stdDeviation controls blur strength, with higher values producing more blur
- Applies directly to any SVG shape, group, or embedded image via the filter attribute
- Serves as the foundational primitive behind many more complex filter effects
Common Uses Beyond Simple Softening
Beyond a straightforward soft-focus effect, feGaussianBlur is commonly chained with feColorMatrix and feComposite to build glow effects around icons or text, and combined with feOffset as the basis for the classic drop-shadow filter chain, making it one of the most reused building blocks in SVG filter design.
- Chains with feColorMatrix and feComposite to build glow effects
- Forms the basis of the classic drop-shadow filter chain alongside feOffset
- One of the most frequently reused building blocks in SVG filter design
Frequently Asked Questions
Does a strong blur value affect an element's clickable or interactive area?
No, the blur is purely a visual rendering effect — the underlying shape's actual geometry and interactive hit area remain unchanged regardless of how strong the visual blur appears.
Can I animate the blur amount for a focus or transition effect?
Yes, animating the stdDeviation attribute value via CSS or SMIL creates a smooth transition between sharp and blurred states, useful for focus-pull or reveal-style animation effects.
Related guides
Ready to Convert Your Image to SVG?
Free online converter — no sign-up, no watermarks, results in under 3 seconds.
Try It Free — Convert Image to SVG