<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<linearGradient id="linGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:rgb(255,0,0);stop-opacity:1"/>
<stop offset="100%" style="stop-color:rgb(0,255,0);stop-opacity:1"/>
</linearGradient>
<radialGradient id="radGrad" cx="50%" cy="50%" r="50%" fx="50%" fy="50%">
<stop offset="0%" style="stop-color:rgb(255,0,0);stop-opacity:1"/>
<stop offset="100%" style="stop-color:rgb(0,255,0);stop-opacity:1"/>
</radialGradient>
<filter id="f1" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1" primitiveUnits="objectBoundingBox">
<feFlood flood-color="#000" x="5%" y="5%" width="5%" height="5%" result="flood1"/>
<feFlood flood-color="#000" x="0%" y="0%" width="5%" height="5%" result="flood2"/>
<feComposite in="flood1" in2="flood2" result="pair"/>
<feTile in="pair" result="tile"/>
<feDisplacementMap in="tile" in2="SourceGraphic" scale="64" xChannelSelector="R" yChannelSelector="G"/>
</filter>
</defs>
<image x="10" y="10" width="100" height="100" xlink:href="../W3C-SVG-1.1/resources/rotate20.png" filter="url(#f1)"/>
<image x="130" y="10" width="100" height="100" xlink:href="../W3C-SVG-1.1/resources/sphere.png" filter="url(#f1)"/>
</svg>