Creating 3D Effects with Circles
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" width="100%"
height="100%">
<defs>
<radialGradient id="blueCircle"
gradientUnits="objectBoundingBox" fx="30%" fy="30%">
<stop offset="0%" style="stop-color:#FFFFFF" />
<stop offset="40%" style="stop-color:#0000AA" />
<stop offset="100%" style="stop-color:#000066" />
</radialGradient>
<circle id="3DBlueCircle" cx="0" cy="0" r="80"
style="fill:url(#blueCircle)" />
</defs>
<g width="100%" height="100%">
<use xlink:href="#3DBlueCircle" x="100" y="100" />
</g>
</svg>
Related examples in the same category