PaceUI

Blocks
MCPComponentsTemplatesChartsStarter
Motion Components
Introduction
Motion AI
Modal Ability SelectorModal SelectorResponse WriterAI SuggestionsToken Counter
Motion Components
Reveal TextScramble TextSquash TextBouncing TextMouse Wave TextText Fall ButtonSpring ButtonInfinite ScrollerFillable ButtonAnimated StackLayered StackGradient ShadowProfile PeekFlip RevealReveal on ScrollTilt CardSwap

Build faster with Pro

Unlock all premium blocks, templates, and support future updates.

Get Full Access

Reveal Text

PreviousNext

A smooth text reveals animation where each heading reveals related content on interaction.

Default

npx shadcn@latest add @paceui/motion-reveal-text

Loading preview...

Word by word

Set type to words, the text will be split by individual words.

npx shadcn@latest add @paceui/motion-reveal-text

Loading preview...

Line by line

Set type to lines, the text will be split by individual lines.

npx shadcn@latest add @paceui/motion-reveal-text

Loading preview...

Masked line

Set splitTextVars with the code to reveal each line as if it's masked.

npx shadcn@latest add @paceui/motion-reveal-text

Loading preview...

Assemble

Set gsapVars with the code, and the text will appear as if it's coming from broken pieces.

npx shadcn@latest add @paceui/motion-reveal-text

Loading preview...

Props

RevealText

PropTypeDefault
typechars words lineschars
Token CounterScramble Text

PaceUI

The ultimate toolkit empowering your designers and developers to launch their next big idea without ever settling on quality

Pages

ComponentsBlocksMCPTemplatesStarter

Account

ManageLicensesPricing

Support

AffiliateContact UsPrivacy PolicyTerms of ServiceDocs

© 2026 PaceUI. All rights reserved. Built by indie developer, Denish

PACEUI