Filters allow you to apply a variety of effects to elements or groups of elements. Filters allow you to blur images, apply lighting effects, and many other advanced image manipulation techniques. If you've ever used Adobe Photoshop or other graphics manipulation programs, these filters are just like the filters you've seen in that environment.
Filters are implemented in the defs section of the SVG document and are grouped as part of a filter element. They are referenced the same way that mask and clipPath elements are, via a fragment URL. The following example shows the common Gaussian blur filter applied to a circle:
<svg
xmlns="http://www.w3.org/2000/svg" width="300" height="150" viewBox="0 0 300 150">
<filter id="blurIsm">
<feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
</filter>
<circle cx="75" cy="75" r="50" fill="red"/>
<circle cx="200" cy="75" r="50" fill="red" filter="url(#blurIsm)"/>
</svg>Rendered in...