blob: eab0307fad438778f436e9a34c9d5d1c5d0ec22b [file] [log] [blame]
<svg xmlns="http://www.w3.org/2000/svg" width="350">
<defs>
<clipPath id="clip1">
<rect width="200" height="200"/>
</clipPath>
<clipPath id="clip2">
<rect width="200" height="200"/>
<rect width="200" height="200"/>
</clipPath>
</defs>
<g>
<circle cx="50" cy="50" r="50" fill="green"/>
<circle cx="100" cy="50" r="50" fill="red" />
<g clip-path="url(#clip1)" opacity=".5">
<circle cx="50" cy="100" r="50" fill="green"/>
<circle cx="100" cy="100" r="50" fill="red" />
</g>
</g>
<g transform="translate(200,0)">
<circle cx="50" cy="50" r="50" fill="green"/>
<circle cx="100" cy="50" r="50" fill="red" />
<g clip-path="url(#clip2)" opacity=".5">
<circle cx="50" cy="100" r="50" fill="green"/>
<circle cx="100" cy="100" r="50" fill="red" />
</g>
</g>
</svg>