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.
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