Rotating Words

Swaps words in place while the slot glides to the new width, so the sentence never jumps. Slide, flip or blur.

keyframes2 files · 72 locdeps: clsx, tailwind-merge

Made for designers

Ship it today

Feels alive

With the shadcn CLI, pointing at this platform’s registry:

npx shadcn@latest add https://opusui.131199999.xyz/r/rotating-words.json

Or offline, straight from your opus55 checkout (copies every file it needs):

node ../tailwind_component/opus55/scripts/add.mjs rotating-words

import { RotatingWords } from "@/components/opus/text/rotating-words";

<h1>Made for <RotatingWords words={["designers", "engineers"]} /></h1>

Prop	Type	Default	Description
words	string[]	—	Words to cycle.
interval	number	2200	ms per word.
effect	"slide" \| "flip" \| "blur"	"slide"	Swap animation.