Transparent Split Ticker - Minimalist Animated Hero Text

Transform your website's hero section with the Transparent Split Ticker, a sleek and modern text animation widget designed for high-impact storytelling. This minimalist widget features a responsive split-screen layout where a static anchor phrase (e.g., "possibilities") meets a dynamic, vertically scrolling list of feature words (e.g., "Limitless", "Creative", "Digital").

Engineered for versatility, its transparent background allows it to overlay seamlessly onto any video, image, or gradient background. The widget includes a smart, auto-adjusting animated underline that expands and contracts in real-time to match the width of each active word, adding a layer of interactive polish to your design.

Key Features:

• Transparent & Overlay-Ready: Designed with a transparent background to sit perfectly on top of your existing hero media.
• Dynamic Split Layout: A professional 50/50 split (vertically stacked on mobile) that pairs a static headline with an infinite loop of changing keywords.
• Smart Animated Border: The bottom border line dynamically resizes using JavaScript to match the exact pixel width of the currently active word.
• Fully Customizable: Edit fonts, colors (text & underline), and content directly from the frontend editor using CSS variables.
• Responsive Design: Automatically adjusts font sizes and layout for mobile devices, ensuring your message is clear on any screen size.
• Lightweight Performance: Built with pure CSS and vanilla JavaScript for zero-dependency speed.

Best Used For:

• Modern Hero Sections
• Portfolio Introductions ("I am a [Designer / Developer / Creator]")
• Service Highlights ("We provide [Speed / Quality / Value]")
• Brand Mission Statements