NR — Text Reveal

Split Text Scroll Animation

Editorial split-text animation that reveals headlines by character, word, or line as they enter the viewport. Most reveal components treat your headline as decoration. This one treats it as content. The split spans are hidden from assistive technology and the container carries the full sentence as its label, so screen readers announce your headline as a headline — not as forty separate letters. You also choose the semantic tag it renders as, so an H1 stays an H1 in the DOM and your page structure survives the animation. What's included: • Split by Characters, Words, or Lines — words never break mid-word • Four entrance effects — Rise, Fade, Mask, and Blur • Play on scroll or on load, with an adjustable viewport threshold • Replay on every re-entry, or animate once • Semantic tag control — H1, H2, H3, Paragraph, or Div • Independent Duration, Stagger, Delay, and Distance • Three editorial typefaces built in — Cormorant Garamond, DM Sans, DM Mono • Respects prefers-reduced-motion — motion is removed, the text still appears • Frozen final frame on canvas, export, and thumbnails No external animation library required. Fully responsive — Desktop / Tablet / Mobile All text and colors editable via Component Properties Part of the JUDE Neo-Retro component library — editorial components built around serif headings, hairline rules, and generous whitespace. See the full set, including the paid components: https://judestudiokorea.gumroad.com/?utm_source=framer&utm_medium=free-component&utm_campaign=nr-text-reveal — Designed by JUDE

Split Text Scroll Animation