Blur-in text animation
Character, word, or line-level reveal with a dozen animation presets (blurInUp, slideUp, scaleUp, etc). Use `once` so it does not replay on every scroll re-entry. Good default for section headlines, avoid stacking more than one per screen.
Live preview
open in new tab ↗import { TextAnimate } from "@/components/magicui/text-animate"
export function TextAnimateDemo() {
return (
<TextAnimate animation="blurInUp" by="character" once>
Placeholder headline text
</TextAnimate>
)
}Block id: magicui-text-animatemotion · swap-content
More animation-text blocks
Want the whole site, not just the block?
We ship real client sites in 3 weeks — with blocks like this one, wired to your brand.