TerminalText
Typewriter/terminal text animation effect. Renders text character by character with configurable speed, optional prefix, and blinking cursor.
Basic Usage
Preview
>
With Prefix
Preview
$
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| text | string | - | Text content to animate with the typewriter effect. |
| speed | number | 50 | Typing speed in milliseconds per character. |
| prefix | string | - | Prefix shown before the animated text (e.g. "$ "). |
| cursor | boolean | true | Show a blinking cursor at the end of the text. |
| className | string | - | Additional CSS classes. |
Accessibility
- The full text is available immediately via
aria-labelso screen readers do not need to wait for the animation - The blinking cursor is decorative and hidden from assistive technology with
aria-hidden - Uses
aria-live="polite"to announce text content updates without interrupting the user - Respects
prefers-reduced-motionby showing text immediately when the user prefers reduced motion