Text
BlurText
Scroll-triggered word or letter reveal with blur and slide animation.
Installation
npm install @ai-animate/core
Usage
import { BlurText } from '@ai-animate/core'
<BlurText
text="Built for AI workflows."
/>
Props
textstring—The text to animate
delaynumber200Stagger delay between each word or letter in milliseconds
animateBy'words' | 'letters''words'Whether to split by words or individual letters
direction'top' | 'bottom''top'Direction text slides from
thresholdnumber0.1IntersectionObserver visibility threshold
rootMarginstring'0px'IntersectionObserver root margin
stepDurationnumber0.35Duration of each animation step in seconds
loopbooleanfalseRepeat the reveal animation infinitely
inViewbooleanundefinedBypass IntersectionObserver and start immediately when true
onAnimationComplete() => voidundefinedCalled when last element finishes animating
classNamestring''className on the outer element