<svg id="msvg" width="400" height="400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 400">
<defs id="defs">
<radialGradient id="grd" cx="0.25" cy="0.25" r="0.25">
<stop offset="5%" stop-color="red"></stop>
<stop offset="30%" stop-color="lightgreen"></stop>
<stop offset="100" stop-color="darkred"></stop>
</radialGradient>
<symbol id="sy" viewBox="0 0 400 400">
<circle cx="200" cy="160" r="20" fill="url(#grd)" stroke="pink" stroke-width="2"></circle>
<circle cx="150" cy="60" r="20" fill="url(#grd)" stroke="pink" stroke-width="pink" undefined="2"></circle>
<circle cx="250" cy="60" r="20" fill="url(#grd)" stroke="pink" stroke-width="2"></circle>
</symbol>
</defs>
<use href="#sy"></use>
<use href="#sy" transform="rotate(60.00, 200 200)"></use>
<use href="#sy" transform="rotate(120.00, 200 200)"></use>
<use href="#sy" transform="rotate(180.00, 200 200)"></use>
<use href="#sy" transform="rotate(240.00, 200 200)"></use>
<use href="#sy" transform="rotate(300.00, 200 200)"></use>
</svg>
|