Los efectos de los filtros SVG sobre una fotografía. El ejemplo se compone por veinte botones, cada uno de ellos aplica un efecto de filtro diferente sobre la fotografía. En el ejemplo vamos a ver cuatro efectos diferentes del filtro feColorMatrix, cinco efectos del fitro feComponenetTransfer, dos efectos del filtro feConvolveMatrix, dos efectos del filtro feDisplacementMap, tres efectos del filtro feGaussianBlur y cuatro efectos del filtro feMorphology. SATURATE feColorMatrix type="saturate" in="SourceGraphic" values="0.4" MATRIX feColorMatrix type="matrix" in="SourceGraphic" values="-1 2 -3 0 -.5 0 1 0 0 0 0 0 0 0 0 0 0 0 1 0" HUE ROTATE feColorMatrix type="hueRotate" in="SourceGraphic" values="60" LUMINANCE feColorMatrix type="luminanceToAlpha" in="SourceGraphic" values="0.4" DISCRETE feComponentTransfer feFuncR type="discrete" tableValues="0 .5 1 1" feFuncG type="discrete" tableValues="0 .5 1" feFuncB type="discrete" tableValues="0 .5" TABLE feComponentTransfer feFuncR type="table" tableValues="1 0 1" exponent="5" feFuncG type="table" tableValues="1 0 1" exponent="2" feFuncB type="table" tableValues="1 0 1" exponent="5" IDENTITY feComponentTransfer feFuncR type="identity" feFuncG type="identity feFuncB type="identity" LINEAR feComponentTransfer feFuncR type="linear" slope=".5" amplitude="6" intercept=".25" feFuncG type="linear" slope=".5" amplitude="2" intercept="0" feFuncB type="linear" slope=".5" amplitude="3" intercept=".5" GAMMA feComponentTransfer feFuncR type="gamma" amplitude="2" exponent="1" feFuncG type="gamma" amplitude="2" exponent="3" feFuncB type="gamma" amplitude="2" exponent="1" CONMATRIX feConvolveMatrix feConvolveMatrix order="3" kernelMatrix="-1 -1 3 -2 1 -1-1 1 -1" CONMATRIX 2 feConvolveMatrix feConvolveMatrix order="4" kernelMatrix="-2 2 1 -1 -1 3 2 1 -1 0 -1 -4 -1 1 0 0" MAP + BLUR feDisplacementMap feGaussianBlur stdDeviation="3" result="gausiano" feDisplacementMap in="SourceGraphic" in2="gausiano" scale="200" xChannelSelector="R" yChannelSelector="G" result="C" MAP + BLUR 2 feDisplacementMap feGaussianBlur stdDeviation="3" result="gausiano" feDisplacementMap in="SourceGraphic" in2="gausiano" scale="200" xChannelSelector="G" yChannelSelector="A" result="C" GAUSSIAN feDisplacementMap feGaussianBlur stdDeviation="3" GAUSSIAN 2 feDisplacementMap feGaussianBlur stdDeviation="9" GAUSSIAN 3 feDisplacementMap feGaussianBlur stdDeviation="18" ERODE feMorphology feMorphology operator="erode" in="SourceGraphic" radius="3" ERODE 2 feMorphology feMorphology operator="erode" in="SourceGraphic" radius="6" DILATE feMorphology feMorphology operator="dilate" in="SourceGraphic" radius="3" DILATE 2 feMorphology feMorphology operator="dilate" in="SourceGraphic" radius="6" ORIGINAL