Line Hover Link

Link component with 11 animated underline hover effects. Pure CSS — no JS on hover.

All Variants

Slide
Double
Grow
Strike
Fade
Pulse
Swap
Sweep
Bounce
Arc
Scribble

Navigation Example

SVG Variants

Arc and Scribble draw an SVG stroke on hover using stroke-dashoffset.

Sign up Writings

Props

PropTypeDefaultDescription
variantLineHoverVariant"slide"Animation variant
hrefstring"#"Link destination
targetstringundefinedLink target (e.g. "_blank")
relstringundefinedLink rel attribute
classstringundefinedAdditional CSS classes

Credits