Enable Mix-Blend-Mode

Hi -

Im looking to apply a mix-blend-mode of Difference on all elements in my navigation but having trouble doing so. Ive attempted to target various elements with the below CSS but with no luck.

.class {
mix-blend-mode: difference;
}

Any insight would be greatly appreciated.

Many thanks,
Brian


https://first-crack-1da0fb.webflow.io/

Blending modes are available directly though the controls in the Style panel so no need for custom code anymore.

Hi Matthew -

Many thanks for the quick response. I have tried this but haven’t been able to get it to work. For example, if I select the Div holding the word ‘Menu’ in the menu bar and set it to Difference, it displays no change when it overlaps with the photo just below (the shot that includes Mick Jagger)

Thoughts?

Hey! Could you fix it? No luck for me apparently, the mix blend mode only apply to when set to the section and not to the div block. I don’t know what to do!