clipping a path out of text
I'm trying to clip a shape out of a letter
Currently in the Figma-file I got, this has been done by an SVG image that's being used as an overlay
Is there a way I can just clip it out of the letter? So it becomes transparent with the background coming forward
Or is that SVG image as overlay (and trying to figure out the position it needs) the way to go?
I'm also thinking it may be a better option (in terms of accessibility) to completely set the text in an SVG image to include in the page and serve the actual text content as alternative
I've attached a screenshot of what I'm trying to explain

6 Replies
Is it just the letter b, or is the B part of a longer text?
it's part of a title
and of course the text is covering different parts of a gradient depending on the viewport


you could put the b in a span and then use mask-image with a radial-gradient to cut it out
for example
you'll have to play a bit with the origin position and the color stop, depending on your font

Perfect. Will try this!