How do I create a hover animation applied only to a border (not inside of it)?

How do I just light up the border?

My problem is the animation opacity is affecting everything in the div block (including text)


Example → Scroll to “Our Services” section at: https://www.ammo.studio/
This is exactly what I’m trying to do

When the mouse hovers over the “services”, the border lights up

read-only link:
https://preview.webflow.com/preview/yousefs-sublime-site-423286?utm_medium=preview_link&utm_source=designer&utm_content=yousefs-sublime-site-423286&preview=2ba4c10b245a9caad44506d4ca39c3c3&workflow=preview

I’m practicing how to build websites by replicating ones built with webflow. This is one of many that I am practicing doing

Hi @UncleNoob

You don’t need an interaction for this one. Just use CSS. Add the hover in the styles panel.

1 Like