# TypingAnimation

Source: https://lumeo.nativ.sh/components/typing-animation

# TypingAnimation

Renders text one character at a time with a configurable interval and optional blinking cursor.

## When to Use

-   Hero headings that reveal themselves letter-by-letter for dramatic effect.
-   Terminal-style or command-line UIs.
-   Looping taglines — set `Loop=true` to restart after a pause.

Preview Code

Basic Typing

Hello, Lumeo!|

Copy Code

Preview Code

Looping with Custom Interval

Building th|

Copy Code

Preview Code

No Cursor

No cursor here.

Copy Code

## API Reference

Property

Type

Default

Description

Text

string

""

The full text to type out character by character.

IntervalMs

int

50

Delay in ms between each character.

DelayMs

int

0

Delay before the animation starts.

ShowCursor

bool

true

Show a blinking cursor after the typed text.

Cursor

string

"|"

The cursor character.

Loop

bool

false

When true, restarts the animation after the text is fully typed.

LoopPauseMs

int

1500

Pause in ms after full text before restarting (Loop only).

## Related Components

-   [TextReveal](/components/text-reveal) — Word-by-word text reveal on scroll.
-   [AnimatedGradientText](/components/animated-gradient-text) — Gradient text with animated hue shift.
