Skip to content

component

Underline Motion

By Aashay Agrawal

Details

Summary

Hover underline text animation

Description

Details Center Underline allows you to create polished text hover states with multiple underline animation styles. The underline can expand from the center, enter from one side and exit from the other, or start visible and animate out on hover. This makes it flexible enough for both subtle interface details and more expressive typographic interactions. Key Features Custom text input Extended font controls Custom text color Custom underline color Three animation styles Left and right direction control Adjustable animation duration Multiple easing options Adjustable underline height Adjustable underline spacing Auto-width and auto-height layout support Lightweight Framer Motion animation Animation Styles Center The underline expands smoothly from the center on hover. Comes In, Goes Out The underline enters from one direction and exits from the opposite direction. Goes Out, Comes In The underline starts visible and disappears on hover with directional motion. Property Controls

Introduction

Hover underline text animation

Rank history

Daily rank per list, from the first snapshot — lower is better.

15011001150116898/148/228/309/79/15
  • All · #1023