Changing Blend Mode for Header Nav

Hi all,

I'm looking to incorporate CSS to my nav header using a difference blend mode on my site:

https://cow-prism-nfr6.squarespace.com/

I've tried adding it to a few elements but haven't had success. Here are a few examples of what I'd like to achieve, thanks!

https://anniversary.blindbarber.com/

https://postcompany.co/information

Thanks again!

Kyle

Hi Kyle.

Saw that you pulled it off. Looks great.

Please share how you did it.

Thx!

8 hours ago, mnik said:

Hi Kyle.

Saw that you pulled it off. Looks great.

Please share how you did it.

Thx!

 

You can try this code to Website > Website Tools > Custom CSS

header#header {
    mix-blend-mode: difference;
}

Hi!

I'm trying to create the same effect you did for your site, however, when I use the code above it just makes my header disappear 😞 Any thoughts on how to fix this? Here is my site below

zaheersukhnandan.com