Morphing Text
newWords melt into one another — a cross-blur pushed through an SVG alpha threshold for a liquid, gooey morph.
svg-filterrAF2 files · 104 locdeps: clsx, tailwind-merge
Installation
With the shadcn CLI, pointing at this platform’s registry:
npx shadcn@latest add https://opusui.131199999.xyz/r/morphing-text.jsonOr offline, straight from your opus55 checkout (copies every file it needs):
node ../tailwind_component/opus55/scripts/add.mjs morphing-textUsage
import { MorphingText } from "@/components/opus/text/morphing-text";
<MorphingText words={["Design", "Ship", "Repeat"]} className="text-7xl font-bold" />API
| Prop | Type | Default | Description |
|---|---|---|---|
| words | string[] | — | Words to morph between. |
| morphTime / holdTime | number | 1.1 / 1.6 | Seconds. |