<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
  <defs>
    <mask id="circleMask1" x="0" y="0" width="100" height="100" >
      <circle cx="50" cy="50" r="40" style="stroke:none; fill: #ffffff"/>
    </mask>
    <mask id="circleMask2" x="0" y="0" width="100" height="100" >
      <circle cx="50" cy="150" r="0" style="stroke:none; fill: #ffffff"/>
    </mask>
    <mask id="circleMask3" x="0" y="0" width="100" height="100" >
      <circle cx="50" cy="250" r="0" style="stroke:none; fill: #ffffff"/>
    </mask>
  </defs>
  <rect id="mask1" x="10" y="10" width="80" height="80" fill="blue" mask="url(#circleMask1)"/>
  <rect id="mask2" x="10" y="110" width="80" fill="blue" height="80"/>
  <rect id="mask3" x="10" y="210" width="80" fill="blue" height="80"/>
</svg>