Text Velocities

What is Text Velocity?

Text Velocity is a premium animated text component that cycles through a configurable list of words with choreographed per-character motion. Each character enters with a staggered slide-up, blur-dissolve, and glow flare, while an animated cursor punctuates the end of each word. The rotating section maintains a fixed width to prevent layout shift, keeping your headline stable and polished. Ideal for hero sections, value propositions, and feature highlights — drop it in, add your words, and publish.

Core Features

• Staggered per-character animation with slide, blur-dissolve, and glow overshoot on entry

• Animated blinking cursor that enters and exits in sync with each rotating word

• Six curated colour themes (Ocean, Ember, Frost, Aurora, Neon, Mono) plus full custom colour control

• Zero layout shift — the rotating section locks to the widest word so your prefix text never moves

• Viewport-gated animation engine that only runs when visible, preserving scroll performance

• Four interactive hover effects (None, Glow, Lift, Scale) with smooth transitions

Controls inside Framer

Text

• Prefix — static text before the rotating word

• Rotating Words — array of words that cycle (up to 20)

• Font — family and weight

• Font Size — 16px to 200px with stepper

• Letter Spacing — fine-tune character spacing

• Line Height — vertical rhythm control

• Alignment — Left, Center, Right (segmented control)

• Uppercase — transform all text

Theme

• Theme — six curated presets or Custom

• Prefix Color — visible when Theme is Custom

• Rotating Text Color — visible when Theme is Custom

• Accent Color — cursor and glow colour, visible when Theme is Custom

Animation

• Stagger — delay between each character (0.01s to 0.15s)

• Duration — animation time per character (0.1s to 1s)

• Hold — how long each word stays visible (0.5s to 15s)

Effects

• Glow — toggle colour glow around rotating text

• Glow Intensity — radius of the glow effect (2px to 30px)

• Cursor — show or hide the blinking accent cursor

• Pause on Hover — freeze rotation on hover

• Hover Effect — None, Glow, Lift, or Scale

Best use cases

• Hero headlines that cycle through value propositions or product benefits

• Portfolio headers that rotate through specialities or project types

• SaaS landing pages highlighting features, audiences, or outcomes

• Agency sites showcasing capabilities with dynamic, branded motion

Pick a theme, add your words, and ship a production-ready animated headline in under a minute.

Questions or custom requests?

We design and build custom Framer components. Get in touch at contact@teampixel.com.au.