Fade Content
Wrapper that fades content in on scroll, plain or out of focus, from washed-out gray, or through grain, mist and pixel blocks.
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-TWRelated components
- Animated Content
Wrapper that reveals its content on scroll with slides, blur, 3D tilts, soft wipes and staggered children.
- Glow Cursor
Light that pours from the cursor, drifts softly through the air and cools as it fades.
- Gradual Blur
Progressive edge blur for headers, footers, captions and carousels, with an optional fade to color that hides at the ends of a scroll.