clip-path-transform-001.html

Enable keyboard shortcuts

<svg>

    <defs>

        <clipPath id="clip" transform="translate(-50,0)">

            <rect x="0" y="0" width="100" height="100" transform="translate(50,0)"></rect>

        </clipPath>

    </defs>

    <g clip-path="url(#clip)">

        <circle cx="50" cy="50" r="50" style="fill: green;"></circle>

    </g>

</svg>