BlurReveal

BlurReveal splits your text and animates each unit in from a blurred, transparent state - optionally with a vertical offset for a drifting feel. It is designed for cinematic heading reveals and taglines.

blurReveal is a standalone helper, not a tween property. Call it directly and it returns a Timeline you can play, pause, scrub, and reverse.

---

Word-Level Reveal

The default type: 'words' reveals each word as a separate unit. Pair with a small y offset to give each word a drifting entrance.

Beautiful cinematic text reveals.

60 FPS

---

Character-Level Reveal

type: 'chars' animates every letter independently - ideal for short words, logos, or display headings.

ANIMX

60 FPS

---

Line-Level Reveal

type: 'lines' groups text by wrapped line and reveals each line as a block - clean for paragraph intros or multi-line taglines.

Animate anything.
Control everything.
Deploy anywhere.

60 FPS

---

API

import { TextEffects } from 'animx/plugins/Text'

const tl = TextEffects.blurReveal(target, config)
tl.play()

Returns a Timeline. All playback methods (pause, reverse, seek, kill) are available.

Options

Option	Default	Description
type	'words'	Split unit: 'chars', 'words', or 'lines'.
blur	20	Starting blur radius in pixels.
y	0	Starting vertical offset in pixels.
duration	1	Duration of each unit's animation in seconds.
ease	'cubic.out'	Easing applied to each unit.
stagger	0.05	Delay between each unit's start, in seconds.
revertOnComplete	false	Remove split spans and restore the original DOM on completion.
onElementStart(el, i)	-	Callback fired when each unit begins animating.

All other standard tween options (repeat, yoyo, onComplete, etc.) are forwarded to the inner tween.