Module 37 of 71
What is the Divi Line Hover module?
Line Hover is a Divi 5 module in Divi Supreme Pro that adds an animated line to text when visitors hover it. It is made for navigation-style links, calls to action, footer links and labels.
Pick one of 15 effects, from Underline Sweep Right and Lines Connect to Zigzag Line Animation and Glitch Effect. Set the line colour, duration, delay and the gap between the text and the line, then link the text to any URL.
line effects
max duration
max line offset
custom code
Start from a Line Hover recipe.
The recipes and the playground run on the front end. Use Preview, or open the page, to try them.
Try every Line Hover setting.
The recipes and the playground run on the front end. Use Preview, or open the page, to try them.
Everything Line Hover can do.
15 effects
Sweeps, double lines, connects, dashes, bends, zigzags, pulses and a glitch.
Your colour
Any line colour, including Divi global colours.
Duration and delay
Fine-tune the speed and add a delay in milliseconds.
Line offset
Set the space between the text and the line.
Link it
Send the text to any URL, in the same or a new tab.
Full typography
Divi font settings and alignment for the text.
Line Hover documentation
Setup for Divi 5: text, link, effect, colour, duration, delay and line offset.
Questions about Line Hover.
Next module, A to Z
Loop Filter Module
Related modules
Buttons Module
Buttons with 29 hover effects.
Text Notation Module
Underline and circle words on scroll.
Menu Module
Headers and mega menus.
Make every link feel considered.
Line Hover comes with 70+ Divi 5 modules and 16 extensions in Divi Supreme Pro.