Components
Animated text that loops each letter through changing size, weight and color to create an infinite wavy effect.
Loading preview...
import { TextWavy } from '@/components/ui/text-wavy';
export default function TextWavyDemo() {
return (
<div className="flex justify-center items-center size-full">
<TextWavy
delayTime={1}
colors={['rgba(0,0,0,0.5)', 'black', 'rgba(0,0,0,0.5)']}
fontSizes={['16px', '20px', '16px']}
className="uppercase tracking-wider"
text={"Let's create a wave effect"}
/>
</div>
);
}