clipPath
Parameters#
Parameter | Description |
---|---|
clipPathUnits | the coordinate system of the pattern contents either objectBoundingBox or userSpaceOnUse |
## Remarks# | |
Related W3C Recommendation informations | |
## Clipping to a circle path |
<svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 100 100" xmlns:xlink="https://www.w3.org/1999/xlink">
<defs>
<clipPath id="circleClip">
<circle cx="50" cy="60" r="20" />
</clipPath>
</defs>
<image width="100" height="100" style="clip-path:url(#circleClip)" xlink:href="https://cdn.sstatic.net/Sites/stackoverflow/company/img/logos/so/so-icon.png" />
</svg>
Original logo | Logo after clipping |
---|---|