▼
Streaming live at 10am (PST)

Subtracted text (See through text)

Design help General
#1

Hey! Is there anyone kind enough and full of knowledge to help me out with this:

I want to make a button (click-able element) but the text in this element should be ‘see through’ (subtracted), so the background is visible. I can’t find out how to do this and also google searches came back with nothing (although i have seen a lot of Webflow websites with this “effect”)

(i would include an example picture, but somehow it keeps on giving an upload error)

Thanks in advance,

Pjotr

#2

This website has it for example, except it is not clickable:
http://www.ilovemy.de

#3

@Pjotr If you are talking about the text “Director Strategy & Innovation”, it looks like that was an image that has been imported. So probably prepared in photoshop or illustrator. You can use your browser’s web inspector to help determine how a site is constructed.

#4

@jdesign Thanks for the reply. I think you’re right, at first i thought it wasn’t because it scaled and changed position on mobile devices, but when i had a closer look it turned out it were just black letters when being viewed scaled!

Thanks!

#5

Here, it’s explained how to use png or SVG mask to cut a hole in a parent element:

#6

Thanks! I did it with an image however, what jdesign suggested.

#7