Skip to content

component

Auora Text Reveal

By Can Girgin

Details

Summary

Bring headlines and long copy to life—without hacks.

Description

Bring headlines and long copy to life—without hacks. Aurora Text Reveal animates text as you scroll, with pixel-perfect left alignment and two reveal modes: by word or across the entire paragraph. Choose a vivid gradient, a clean editorial look, or the Newspaper underline that fills as you read. What makes it different Flawless left edge: no indent drift on wrapped lines. Whole-paragraph gradient: one continuous gradient that tracks the exact line wraps. Per-character fade: smooth, readable reveal as you scroll. Newspaper mode: soft underline that can fill live with scroll. Manual line breaks: split the paragraph exactly where you want with Break After. Sane panel: only the controls you need. Controls Text – Your copy (plain text, multi-line). Font – All Framer font properties. Preset – Editorial , Vivid Gradient , Newspaper (Underline) . Unrevealed Color – Color of the yet-to-reveal text. Gradient Start / End – For Vivid Gradient . Gradient Scope – Per Word or Whole Paragraph . Underline – Color for Newspaper preset. Live Fill (Scroll) – Animate the underline width with scroll. Trigger Start / End – When the reveal begins/ends within the viewport. Break After – Comma-separated word indices to force line breaks (e.g. 6, 18, 34). How to use Drop Aurora Text Reveal onto your canvas. Paste your copy into Text . Pick a Preset (try Vivid Gradient on dark). Tune Trigger Start/End for your layout (e.g. 0.9 / 0.3). If you need precise line wraps, add indices to Break After . Tips For longer sections, use Whole Paragraph scope for a single flowing gradient. Keep Unrevealed Color slightly muted for best contrast. If the reveal feels too fast/slow, nudge Trigger sliders rather than changing animation curves.

Rank history

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

125015001750180058/148/228/309/79/15
  • All · #7811