About this Component
Create eye-catching underline animations for any text in just a few clicks. Advance Underline Text lets you choose from multiple underline styles, customize colors and thickness, and trigger the animation on hover or keep it always visible. Perfect for links, headings, CTAs, navigation, and highlighted copy.
How to use
Drop the component onto your page, enter your text, and customize everything from the properties panel. Choose when the underline appears, pick a style, adjust colors, stroke width, and animation duration—no code required.
Features
Multiple animated underline styles
Trigger on Hover or keep it Always visible
Customize text and underline colors independently
Adjustable underline thickness (stroke)
Fine-tune animation duration
Works with any font installed in your Framer project
Optional random underline variations for a more organic look
Optional link support for interactive text
Lightweight single code component with smooth animations
Designed to make links, buttons, headings, and highlighted text feel more polished while staying easy to customize.
