React Bits

Masked Heading

A headline with a drifting colour mesh or image showing through, revealed word by word.

Masked Heading, a React Bits component

Use Masked Heading 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/MaskedHeading-TS-TW
How to install React Bits components

Related components

  • Gradient Text

    Living gradients inside your text: a sliding sweep, a drifting mesh or a swinging conic fan.

  • Echo Text

    Ghosted copies trail behind the text and settle into a single word.

  • Particle Text

    Text assembles from drifting particles that scatter and reform on demand.