React Bits

Fade Content

Simple directional fade / slide entrance / exit wrapper with threshold-based activation.

Fade Content, a React Bits component

Use Fade Content 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/FadeContent-TS-TW
How to install React Bits components

Related components

  • Animated Content

    Wrapper that animates its children in on scroll or mount, from any direction.

  • Gradual Blur

    Progressively un-blurs content based on scroll or trigger creating a cinematic reveal.

  • Image Trail

    Cursor-based image trail with several built-in variants.