Morphing Text
A text animation that morphs between strings using SVG filters and blur effects.
Installation
npx shadcn-vue@latest add https://raya-ui.com/registry/morphing-text.jsonOr manually:
Install dependencies:
npm install clsx tailwind-mergeCopy the component code into your project.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| texts | string[] | - | An array of strings to cycle through. |
| morphTime | number | 1.5 | Duration of the morphing transition in seconds. |
| coolDownTime | number | 0.5 | Duration the text stays visible before morphing again. |