Animated Text
Text that moves with intent: blur-in, rotating words, palette gradients, shine, decrypting, counting numbers and words that light up as you scroll. Readers always get the plain text.
import { BlurText, RotatingText, GradientText, ShinyText, DecryptedText, CountUp, ScrollRevealText } from "pleate/effects/animated-text";Headlines
Plan less. Travel more.
Trips to Lisbon
Every color is yours.
Your itinerary is being prepared…
Numbers and codes
128K
travellers
4.9
average rating
€2.4M
saved on bookings
CONFIRMATION HT-2041
Hover me: booking secured
Scroll-lit statement
Scroll the page: words light up as they pass.
Pleate keeps the details out of your way: solid surfaces, calm motion and colors that follow you, so the trip, not the interface, is what people remember.
Props
- BlurText
Rise out of blur on view.
text, by: "word" | "letter", as, stagger, delay, distance, once- RotatingText
Rolling word, resizing smoothly.
words, interval, pillClassName- GradientText / ShinyText
Animated fills (palette by default).
colors, speed / base, shine, speed- DecryptedText
Scramble then resolve.
text, trigger: "view" | "hover", speed, characters- CountUp
Counts on view.
to, from, duration, format (Intl), locale- ScrollRevealText
Words light up with scroll.
text, as
Accessibility
- Split text is aria-hidden with the full sentence in a visually hidden copy.
- Reduced motion shows the final state immediately.