examples/readme/overlapping_circles.svg

<svg height="160" width="160" xmlns="http://www.w3.org/2000/svg">
<rect fill="rgb(1,238,144)" height="100%" width="100%" x="0" y="0"/>
<circle cx="0" cy="0" fill="#222" fill-opacity="0.08352941" r="40"/>
<circle cx="160" cy="0" fill="#222" fill-opacity="0.08352941" r="40"/>
<circle cx="0" cy="160" fill="#222" fill-opacity="0.08352941" r="40"/>
<circle cx="160" cy="160" fill="#222" fill-opacity="0.08352941" r="40"/>
<circle cx="40" cy="0" fill="#222" fill-opacity="0.08666667" r="40"/>
<circle cx="40" cy="160" fill="#222" fill-opacity="0.08666667" r="40"/>
<circle cx="80" cy="0" fill="#222" fill-opacity="0.04431373" r="40"/>
<circle cx="80" cy="160" fill="#222" fill-opacity="0.04431373" r="40"/>
<circle cx="120" cy="0" fill="#222" fill-opacity="0.21843138" r="40"/>
<circle cx="120" cy="160" fill="#222" fill-opacity="0.21843138" r="40"/>
<circle cx="0" cy="40" fill="#222" fill-opacity="0.03333333" r="40"/>
<circle cx="160" cy="40" fill="#222" fill-opacity="0.03333333" r="40"/>
<circle cx="40" cy="40" fill="#ddd" fill-opacity="0.14235294" r="40"/>
<circle cx="80" cy="40" fill="#222" fill-opacity="0.18392156" r="40"/>
<circle cx="120" cy="40" fill="#ddd" fill-opacity="0.18156862" r="40"/>
<circle cx="0" cy="80" fill="#ddd" fill-opacity="0.1454902" r="40"/>
<circle cx="160" cy="80" fill="#ddd" fill-opacity="0.1454902" r="40"/>
<circle cx="40" cy="80" fill="#222" fill-opacity="0.047450982" r="40"/>
<circle cx="80" cy="80" fill="#222" fill-opacity="0.21529411" r="40"/>
<circle cx="120" cy="80" fill="#222" fill-opacity="0.1462745" r="40"/>
<circle cx="0" cy="120" fill="#ddd" fill-opacity="0.06392157" r="40"/>
<circle cx="160" cy="120" fill="#ddd" fill-opacity="0.06392157" r="40"/>
<circle cx="40" cy="120" fill="#ddd" fill-opacity="0.13294119" r="40"/>
<circle cx="80" cy="120" fill="#ddd" fill-opacity="0.20666668" r="40"/>
<circle cx="120" cy="120" fill="#222" fill-opacity="0.020784313" r="40"/>
</svg>