Components
Loading preview...
The component splits the text into individual spans, applies staggered animation delays from the center outward, and includes the font weight animation. You can customize the font size, weight range, animation duration, and delay multiplier through props.
npx shadcn@latest add https://21st.dev/r/designali-in/animated-textimport { AnimatedText } from "@/components/ui/animated-text";
export default function DemoOne() {
return (
<main>
<AnimatedText text="Font Design" fontSize={100} />
</main>
)
}