| <body style="zoom: 50%"></body> |
| <svg xmlns="http://www.w3.org/2000/svg" width="0" height="0" version="1.1"> |
| <defs> |
| <filter id="blurY" color-interpolation-filters="sRGB"> |
| <feGaussianBlur stdDeviation="0 5"/> |
| </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="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="turbulence" color-interpolation-filters="sRGB"> |
| <feTurbulence type="turbulence" baseFrequency="0.05" numOctaves="2"/> |
| </filter> |
| </defs> |
| </svg> |
| <style> |
| img { |
| margin: 10px; |
| transform: translateZ(0); |
| } |
| </style> |
| <img src="resources/reference.png"> |
| <img style="filter: url(#blurY);" src="resources/reference.png"> |
| <img style="filter: url(#lighting);" src="resources/reference.png"> |
| <img style="filter: url(#offset);" src="resources/reference.png"> |
| <img style="filter: url(#displacement);" src="resources/reference.png"> |
| <img style="filter: url(#merge);" src="resources/reference.png"> |
| <img style="filter: url(#turbulence);" src="resources/reference.png"> |
| <img style="filter:blur(10px)" src="resources/reference.png"> |
| <img style="filter:drop-shadow(rgba(0,0,0,0.5) 0 5px 5px)" src="resources/reference.png"> |
