SVG Blur Filter in HTML
SVG Blur Filter
All SVG filters are defined by < defs > element. It is used for the definition of the filter which is to be used.
The < filter > element is used to define an SVG filter. The element has a required id attribute that identifies the filter.
The < feGaussianBlur > element is used to create blur effects.
Code explanation of the below code is:-
- The id attribute of the element defines a unique name for it.
- The blur effect is defined with the element.
- The in="SourceGraphic" part defines that the effect is created for the entire element.
- The stdDeviation attribute defines the amount of blur.
- The filter attribute of the element links the element to the "blur_filter" filter.
Code Explanation
All Tutorials related to SVG Tutorials
SVG Intro
SVG & HTML
SVG Circle
SVG Rectangle
SVG Eclipse
SVG Line
SVG Polygon
SVG Polyline
SVG Path
SVG Text
SVG Stroke
SVG Blur Filter
SVG Drop Shadow Filter
SVG Linear Gradient
SVG Radial Gradients in HTML
