SplitReveal Text

Split Reveal Text brings cinematic entrance animations to your typography.

Split Reveal Text brings cinematic entrance animations to your typography. Choose from three distinct presets — Doors (perspective hinge), Split (diverging spread), and Scatter (organic chaos) — each driven by real spring physics so motion always feels natural, never canned.

Presets

• Doors — Characters rotate open on a 3D hinge, like cabinet doors swinging apart

• Split — Units fan outward with a subtle rotation, splitting from a center axis

• Scatter — Each character flies in from a randomized position for an organic, chaotic reveal

Key Features

• Split by word or character (auto-falls back to word mode above a configurable character cap to protect performance)

• Three stagger patterns: Center Out, Alternate, and Random

• Fully configurable spring — tune stiffness, damping, and mass independently

• Trigger on scroll enter or on page load; optional replay on re-enter

• Blur, opacity, scale, distance, and rotation are all controllable from the start state

• Respects prefers-reduced-motion out of the box

• Screen-reader friendly — original text is preserved in a visually hidden element

• Canvas preview mode: see the component revealed or mid-split right inside Framer

Quick Start

1. Drop the component onto your canvas

2. Set your text in Content → Text

3. Pick a Choreography → Preset (Doors is a great starting point)

4. Set Viewport → Trigger to On Enter for scroll-triggered playback

5. Adjust Timing → Stagger and Timing → Stiffness to taste

6. Preview to see the full animation.