Two different colors in the text
Guys, how do I make my text, when it is in the black part, have a white color and when it is in the light part, it will have a dark color?
I tried cloning the text and putting the other in a dark color, and I tried positioning them on each background using the z-index but I couldn't.
Github repo: https://github.com/sircarloschaves/art-gallery-website
Live page: https://sircarloschaves.github.io/art-gallery-website/
GitHub
GitHub - sircarloschaves/art-gallery-website: Frontend Mentor Art G...
Frontend Mentor Art Gallery Website Challenge. Contribute to sircarloschaves/art-gallery-website development by creating an account on GitHub.
11 Replies
Maybe this will help? I made this one a while ago but it should give you an idea what you need to do
https://codepen.io/tok124/pen/LYgYjbP
Yep ^^ backdrop filter invert will do it
I'm trying, but I'm still suffering here
The preview looks like youβve figured it out! Or are you stacking two headings and cutting off the overflow on the black?
Ahh mix-blend-mode! Smart !
Bro, does blend-mode only work on text if it is a direct child of the background?
I'm only using a single text
No, but the two items must be part of different elements. You can't blend the text with the background on the same element. It has to be a child or some other overlapping element.
Background-blend-mode is for the elements own background
Ok
Solved.