Example


<svg width="11.3cm" height="2.2cm" viewBox="0 0 1130 220" version="1.1">
     <title>Example filters00.svg - filter effects before and after</title>
     <desc>Picture of the before and after affects of filtering.</desc>
     <defs>
          <filter id="MyFilter">
               <feGaussianBlur in="SourceAlpha" stdDeviation="4" result="blur"/>
               <feOffset in="blur" dx="4" dy="4" result="offsetBlur"/>
               <feSpecularLighting in="blur" surfaceScale="5" specularConstant="1" specularExponent="10" lighting-color="white" result="specOut">
                    <fePointLight x="-5000" y="-10000" z="20000"/>
               </feSpecularLighting>
               <feComposite in="specOut" in2="SourceAlpha" operator="in" result="specOut"/>
               <feComposite in="SourceGraphic" in2="specOut" operator="arithmetic" k1="0" k2="1" k3="1" k4="0" result="litPaint"/>
               <feMerge>
                    <feMergeNode in="offsetBlur"/>
                    <feMergeNode in="litPaint"/>
               </feMerge>
          </filter>
          <g id="CircleRectTriangle">
               <g>
                    <circle cx="85" cy="80" r="40" fill="yellow"/>
                    <g>
                         <rect x="145" y="45" width="90" height="70" fill="red"/>
                    </g>
                    <path d="M260,40 L335,80 L260,120 z" fill="#4444ff"/>
               </g>
          </g>
          <path id="LineWithArrow" d="M0,-15 h80 v-10 l40,25 l-40,25 v-10 h-80 z"/>
     </defs>
     <g font-family="Verdana" font-size="30">
          <rect x="1" y="1" width="1128" height="218" fill="#cccccc" stroke="blue"/>
          <use x="0" y="0" xlink:href="#CircleRectTriangle"/>
          <text x="20" y="180">Original source graphic</text>
          <use x="380" y="80" xlink:href="#LineWithArrow"/>
          <text x="520" y="70">Filter</text>
          <text x="520" y="120">Effect</text>
          <use x="630" y="80" xlink:href="#LineWithArrow"/>
          <text x="790" y="180">Result of filter effect</text>
     </g>
     <g filter="url(#MyFilter)">
          <use x="750" y="0" xlink:href="#CircleRectTriangle"/>
     </g>
</svg>
Original SVG source