I want to create a clipping mask with an SVG (or CSS Polygon) but Instead of SHOWING what is represented by the SVG, I want the SVG to "Clip" the <div>
and hide what is represented by the SVG.
So See the following picture, I'd like to create a sine wave at the bottom of pictures on mobile so the image (which is a background image) gets clipped with a sine wave at the bottom.
I've spent tons of time with clip-path
and masking but nothing seems to do it. Since clip-path
can't do curves it doesn't seem to work which is why I'm using an SVG.