Astra

Rotating Text

Cycles through multiple phrases with 3D rotate / flip transitions.

Rotating Text, a Astra component

Use Rotating Text in your project

Choose JavaScript or TypeScript and plain CSS or Tailwind. Enable JavaScript for the interactive preview, customization controls and source tabs.

npx shadcn@latest add @react-bits/RotatingText-TS-TW
How to install Astra components

Related components

  • Split Flap Text

    Mechanical split-flap departure board that clacks through to each new phrase.

  • ASCII Text

    Waving ASCII text that tilts toward the pointer, scrambles on hover and ripples on click.

  • Blur Text

    Text starts blurred then crisply resolves for a soft-focus reveal effect.