SmoothUI

Typewriter Text

A typewriter effect for progressively revealing text with optional looping.

Open in v0

Last updated: November 9, 2025

Typewriter Effect Examples

Installation

pnpm dlx shadcn add @smoothui/typewriter-text
npx shadcn@latest add @smoothui/typewriter-text
yarn dlx shadcn add @smoothui/typewriter-text
bunx shadcn add @smoothui/typewriter-text

Features

  • Progressive character reveal with configurable speed
  • Optional looping with pauses
  • Works with headings, paragraphs, and inline text
  • Built with Framer Motion
  • Accessible and performant

Props

Prop

Type

Reveal Text

Animate text into view from different directions with staggered characters.

Scramble Hover

Scramble characters on hover for playful, attention-grabbing text effects.

On this page

Installation
Features
Props

Powered by