<svg xmlns="http://www.w3.org/2000/svg" width="0" height="0" version="1.1">
<defs>
<filter id="colormatrix" color-interpolation-filters="sRGB">
<feColorMatrix type="hueRotate" values="180"/>
</filter>
<filter id="morphology" color-interpolation-filters="sRGB">
<feMorphology radius="10" operator="dilate"/>
</filter>
<filter id="componenttransfer" color-interpolation-filters="sRGB">
<feComponentTransfer>
<feFuncR type="linear" slope="0.5">
<feFuncG type="linear" slope="0.5">
<feFuncB type="linear" slope="0.5">
<feFuncA type="identity">
</feComponentTransfer>
</filter>
<filter id="blurY" color-interpolation-filters="sRGB">
<feGaussianBlur stdDeviation="0 5"/>
</filter>
<filter id="blend" color-interpolation-filters="sRGB">
<feGaussianBlur stdDeviation="5 5"/>
<feBlend in2="SourceGraphic" mode="screen">
</filter>
<filter id="lighting" color-interpolation-filters="sRGB">
<feSpecularLighting>
<feSpotLight pointsAtX="160" pointsAtY="130" pointsAtZ="0" specularExponent="1" limitingConeAngle="20" x="0" y="0" z="10"/>
</feSpecularLighting>
<feColorMatrix type="matrix" values="0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0 0 1"/>
<feBlend in2="SourceGraphic" mode="multiply"/>
</filter>
<filter id="offset" x="0%" color-interpolation-filters="sRGB">
<feOffset dx="10" dy="10"/>
</filter>
<filter id="convolvematrix" color-interpolation-filters="sRGB">
<feConvolveMatrix order="3 3" kernelMatrix="1 1 1 1 -7 1 1 1 1" bias ="0.3"/>
</filter>
<filter id="displacement" color-interpolation-filters="sRGB">
<feDisplacementMap scale="10" xChannelSelector="R" yChannelSelector="G"/>
</filter>
<filter id="merge" color-interpolation-filters="sRGB">
<feColorMatrix type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 0.3 0" result="trans"/>
<feOffset dx="5" dy="5" in="trans" result="offset1"/>
<feOffset dx="10" dy="10" in="trans" result="offset2"/>
<feOffset dx="15" dy="15" in="trans" result="offset3"/>
<feMerge>
<feMergeNode in="trans"/>
<feMergeNode in="offset1"/>
<feMergeNode in="offset2"/>
<feMergeNode in="offset3"/>
</feMerge>
</filter>
<filter id="flood" color-interpolation-filters="sRGB">
<feFlood flood-color="green"/>
</filter>
<filter id="turbulence" color-interpolation-filters="sRGB">
<feTurbulence type="turbulence" baseFrequency="0.05" numOctaves="2"/>
</filter>
<filter id="tile" color-interpolation-filters="sRGB">
<feColorMatrix x="0" y="0" width="40" height="40"/>
<feTile x="0" y="0" width="160" height="80"/>
</filter>
<filter id="drop-shadow" color-interpolation-filters="sRGB">
<feDropShadow dx="10" dy="5" stdDeviation="4"/>
</filter>
</defs>
</svg>
<style>
img {
margin: 10px;
}
</style>
<img src="resources/reference.png">
<img style="filter: url(#colormatrix); filter: url(#colormatrix);" src="resources/reference.png">
<img style="filter: url(#morphology); filter: url(#morphology);" src="resources/reference.png">
<img style="filter: url(#componenttransfer); filter: url(#componenttransfer);" src="resources/reference.png">
<img style="filter: url(#blurY); filter: url(#blurY);" src="resources/reference.png">
<img style="filter: url(#blend); filter: url(#blend);" src="resources/reference.png">
<img style="filter: url(#lighting); filter: url(#lighting);" src="resources/reference.png">
<img style="filter: url(#offset); filter: url(#offset);" src="resources/reference.png">
<img style="filter: url(#convolvematrix); filter: url(#convolvematrix);" src="resources/reference.png">
<img style="filter: url(#displacement); filter: url(#displacement);" src="resources/reference.png">
<img style="filter: url(#merge); filter: url(#merge);" src="resources/reference.png">
<img style="filter: url(#flood); filter: url(#flood);" src="resources/reference.png">
<img style="filter: url(#turbulence); filter: url(#turbulence);" src="resources/reference.png">
<img style="filter: url(#tile); filter: url(#tile);" src="resources/reference.png">
<img style="filter: url(#drop-shadow); filter: url(#drop-shadow);" src="resources/reference.png">