Revision control
++ <svg width="1000" height="400" viewBox="0 0 500 200" xmlns="http://www.w3.org/2000/svg">
++ <defs>
++ <filter id="offset">
++ <feOffset in="SourceGraphic" dx="5" dy="5" />
++ </filter>
++ <circle id="myCircle" cx="45" cy="45" r="25" opacity="0.5"/>
++ </defs>
++
++ <rect x="0" y="0" width="100" height="100" stroke="black" fill="green" opacity="0.5" />
++ <rect x="0" y="0" width="100" height="100" stroke="black" fill="green" opacity="0.5" filter="url(#offset)" />
++
++ <circle transform="translate(100 0)" cx="50" cy="50" r="50" stroke="black" fill="green" opacity="0.5" />
++ <circle transform="translate(100 0)" cx="50" cy="50" r="50" stroke="black" fill="green" opacity="0.5" filter="url(#offset)" />
++
++ <g transform="translate(200 0)" >
++ <circle cx="50" cy="30" r="25" stroke="black" fill="green" opacity="0.5" />
++ <circle cx="50" cy="70" r="25" stroke="black" fill="red" opacity="0.5" />
++ </g>
++ <g transform="translate(200 0)" filter="url(#offset)" >
++ <circle cx="50" cy="30" r="25" stroke="black" fill="green" opacity="0.5" />
++ <circle cx="50" cy="70" r="25" stroke="black" fill="red" opacity="0.5" />
++ </g>
++
++ <line transform="translate(300 0)" x1="0" y1="50" x2="100" y2="70" style="stroke:rgb(255,0,0);stroke-width:2" />
++ <line transform="translate(300 0)" x1="0" y1="50" x2="100" y2="70" style="stroke:rgb(255,0,0);stroke-width:2" filter="url(#offset)" />
++
++ <polygon transform="translate(400, 0)" points="30,30 30,60 50,60" fill="green" stroke="black"/>
++ <polygon transform="translate(400, 0)" points="30,30 30,60 50,60" fill="green" stroke="black" filter="url(#offset)" />
++
++ <polyline transform="translate(0, 100)" points="30,30 30,60 50,60" style="fill:none;stroke:black;stroke-width:3" />
++ <polyline transform="translate(0, 100)" points="30,30 30,60 50,60" style="fill:none;stroke:black;stroke-width:3" filter="url(#offset)" />
++
++ <path transform="translate(100, 100)" d="M10,50 L10,10 L90,50, Z" fill="green" opacity="0.5" />
++ <path transform="translate(100, 100)" d="M10,50 L10,10 L90,50, Z" fill="green" opacity="0.5" filter="url(#offset)" />
++
++ <text transform="translate(200, 100)" fill="blue" x="0" y="20" font-family="Arial" font-size="16" opacity="0.5" > Example Text! </text>
++ <text transform="translate(200, 100)" fill="red" x="0" y="20" font-family="Arial" font-size="16" filter="url(#offset)" opacity="0.5"> Example Text! </text>
++
++ <ellipse transform="translate(300, 100)" cx="50" cy="50" rx="20" ry="40" fill="green" opacity="0.5" stroke="black" />
++ <ellipse transform="translate(300, 100)" cx="50" cy="50" rx="20" ry="40" fill="green" opacity="0.5" stroke="black" filter="url(#offset)" />
++
++ <use transform="translate(400, 100)" href="#myCircle" x="20" fill="blue" stroke="black" />
++ <use transform="translate(400, 100)" href="#myCircle" x="20" fill="blue" stroke="black" filter="url(#offset)" />
++
++
++
++
++
++ </svg>
++
++