Streaming live at 10am (PST)

Button Border Underline Slide In


Hi Guys & Gals,

Is there a way to get a bottom border within a button to slide from left to right?

Example (top 3 buttons e.g ‘The Wine’:

Any help would be great (note the web I am linking to wasn’t built in webflow)

Many Thanks


Here is my site Read-Only: LINK
(how to share your site Read-Only link)


Hi Matt,

Great question! :webflow_heart:

I would suggest cloning the Avocado UI Kit which contains an interaction that you may can use.

The UI kit can be found at

And, the button interactions can be viewed at the following URL:

Great question!

Hopefully this was helpful :bowing_man:


I was playing around and also made a quick example, using interactions affecting to multiple elements:, not exactly the same effect, but maybe might help give some ideas.


Thanks guys! Some real good advice there and lots of ideas.

Cheers again - keep up the good work :+1:


I’m unable to find out how it’s done :weary:

I’d like to recreate the “read more link” hover interaction. I see no interactions applied nor styles on hover? :thinking:

I also tried to copy the css code into my project, but nothing.