SplitReveal
Reveals text character by character or word by word with a stagger, triggered on viewport entry and respecting reduced-motion preferences.
Hello Elyri
Customize
Props
| Prop | Type | Default | Description |
|---|---|---|---|
children | string | — | Text to reveal |
by | 'char' | 'word' | 'char' | Split the text into characters or words |
delay | number | 0 | Start delay in milliseconds |
stagger | number | 40 | Delay between adjacent units in milliseconds |
duration | number | 600 | Animation duration per unit in milliseconds |
distance | number | 24 | Travel distance in pixels |
once | boolean | true | Only trigger the first time it enters the viewport |
className | string | — | Extra class name |
Dependencies
IntersectionObserver