Breaking News: Grepper is joining You.com. Read the official announcement!

svg how to invert clipping area

Handsome Hedgehog answered on September 23, 2022 Popularity 2/10 Helpfulness 1/10

answer svg how to invert clipping area

svg how to invert clipping area

Comment

<svg id="mySVG" width="600" height="250">
    <defs>
        <mask id="myMask" x="0" y="0" width="600" height="250" >
            <rect width="600" height="250" fill="white"/>
            <circle cx="25" cy="25" r="25" fill="black"/>
        </mask>
    </defs>

    <rect x="0" y="0" width="600" height="250" fill="blue" mask="url(#myMask)"></rect>
</svg>
 Run code snippetHide results

Popularity 2/10 Helpfulness 1/10 Language whatever

Source: stackoverflow.com

Tags: area clipping svg whatever

Link to this answer
Share Copy Link