Note: Internet Explorer and Safari do not support SVG filters! All SVG filters for the Internet are defined in Here is the SVG code: Example Code parsing: The in= “SourceGraphic” section defines the effect created by the entire image StdDeviation attribute defines fuzzy quantity 1.15.1.
<defs>
and
<filter>
¶
<defs>
element.
<defs>
element definitions are short and contain special element definitions, such as filters.
<filter>
tags are used to define SVG filters.
<filter>
the tag usesthe required id attribute to define which filter to apply to the drawing? 1.15.2. SVG
<feGaussianBlur>
¶ Example 1 ¶
<feGaussianBlur>
elements are used to create blur effects:<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
<defs>
<filter id="f1" x="0" y="0">
<feGaussianBlur in="SourceGraphic" stdDeviation="15" />
</filter>
</defs>
<rect width="90" height="90" stroke="green" stroke-width="3"
fill="yellow" filter="url(#f1)" />
</svg>
<filter>
the element id attribute defines a unique name for a filter
<feGaussianBlur>
element definition blur effect
<rect>
the filter attribute of the element is used to link the element to the “F1” filter