Reveal Text

Animated React text reveal component with directional entrances, staggered character and word animations, and customizable timing.

Open in v0~0.4 kB

Last updated: March 18, 2026

Reveal Text Examples

Welcome to SmoothUI
Beautiful animations
Made with Framer Motion
Scroll down to see more examples!

Installation

npx smoothui-cli add reveal-text

Features

  • Enter animations from up, down, left, or right
  • Character or word stagger options
  • Delay and duration controls
  • Built with Framer Motion
  • Accessible and performant

Accessibility

Reduced Motion

This component respects the prefers-reduced-motion media query via useReducedMotion from Motion. When reduced motion is preferred, the text is displayed immediately at full opacity without any directional slide animation.

Props

On this page

Created by

Powered by

motion.dev