Displays a beautiful Smooth Typing Text.
npm install framer-motionimport { ClassValue, clsx } from "clsx"
import { twMerge } from "tailwind-merge"
export function cn(...inputs: ClassValue[]) {
return twMerge(clsx(inputs))
}
| Prop | Type | Description |
|---|---|---|
| words | string | Generate text words. |
| className | string | Additional classes for the Text. |
| cursorClassName | string | Additional classes for the cursor. |
export function TypewriterEffectSmoothDemo() {
const words = [
{
text: "Build",
},
{
text: "animation",
},
{
text: "smooth",
},
{
text: "typing",
},
{
text: "text.",
},
]
return (
<div className="flex flex-col items-center justify-center h-[20rem] ">
<TypewriterEffectSmooth words={words} />
</div>
)
}