Streaming live at 10am (PST)

How to make black text button look nice on white background (hover effect)

Hi guys!

I have a question on how to make my buttons “light up” (hover effect) when someone holds over it. To make it responsive I think is the right word.

I’m fairly new to webflow but know it’s done in the hover state, but with using black text on white background I just cant get it to look nice :stuck_out_tongue: Looks awful

Here is a pic:

You see “hjem” is hovered and “produkter” is not. “Hjem” looks awful with text shadows.

I also tried changing some opacity and played around with some effects but I just can’t figure out a way to get it to look good.

Any tips on how to do this? What settings can I use to make a black text (button) on white background look nice when hovering?


Honestly I tend to just drop the opacity, or sometimes use a gray instead of black. Also distance and blur should be used. But that being said, as a designer, the hover text effect is pretty dated in terms of modern design. Those kind of hover effects are huge in like the 90’s and 2000’s. Perhaps doing a simple color change or an underline might work better? Or make them buttons where the whole button div changes color with rounded corners maybe?

Thanks bud - underline worked great!