Gradient Underlines with Smooth Hover Animation | Webflow Tutorial 2021

Published: 16 August 2021
on channel: Simon Lampert

3,516

110

In this video, I will show you how to create and animate gradient underlines in Webflow. We will add a smooth hover animation by using custom CSS code. I will guide you through the full process so that you will be able to create your own underline hover animations after watching my tutorial. Hopefully, this video will be helpful for you! 👍

💻 Use Webflow: https://webflow.grsm.io/simonlampert
⚡ Check out the Relume Library: https://library.relume.io/?via=simon
🖥️ Get the code snippet here:
https://simonlampert.notion.site/Unde...

🔥 Follow me on Instagram:   / simonwebdev

🦅 Follow me on Twitter:
  / simonwebflow

🌎 Connect with me on LinkedIn:
www.linkedin.com/in/simon-lampert

📷 Timestamps
0:00 - Introduction
0:50 - Creating an underline gradient
2:00 - Placing a CSS embed and explaining the code
4:22 - Creating a hover underline animation
6:56 - Outro

🎵 The songs:
Six Seasons - Unicorn Heads
   • Unicorn Heads - Six Seasons

Whip - Yung Logos
   • Video

Like That - Anno Domini Beats    / @annodominibeats

Soul Searching - Causmic    / @causmic

Turtle Time - Verified Picasso    / @verifiedpicasso7260

👍 Check out my other Webflow videos if you want to learn more and leave a like if you think this tutorial was helpful. Do you have a question? Just ask in the comments. Never miss a new video again by subscribing to my channel.

See you next time! 😎

On this page of the site you can watch the video online Gradient Underlines with Smooth Hover Animation | Webflow Tutorial 2021 with a duration of hours minute second in good quality, which was uploaded by the user Simon Lampert 16 August 2021, share the link with friends and acquaintances, this video has already been watched 3,516 times on youtube and it was liked by 110 viewers. Enjoy your viewing!

75,690

345