This title animation on image hover

Design help Animations & Interactions
1

I there guys, I was wondering how to achieve this title animation when hovering an image on webflow.

I inspected the element and it seems to be 3 spans but I’m unsure how to replicate it. Would appreciate some insight.
Thanks guys.

2

Make it 3 divs in a div. The outer div will be flexbox centered. The middle div of the 3 divs can be 1 or 2 px height with hite bg and a width. With IX, you’ll just make this div’s width shrink, and play with the opacity of the outer div.

3

Thanks a bunch for your insight mate.

1 Like