ai-animate

Text

CursorText

Typewriter effect with realistic variable-speed typing and optional pause markers.

Installation

npm install @ai-animate/core

Usage

import { CursorText } from '@ai-animate/core'


<CursorText text="Welcome to the future." baseSpeed={65} />

Props

textstringFull text to type. Use [pause] to insert delays (required)
baseSpeednumber65Base speed per character in milliseconds
pauseMsnumber600Duration of pause marker in milliseconds
cursorCharstring'|'Character to use as cursor
blinkSpeednumber530Cursor blink speed in milliseconds per half-cycle
holdMsnumber1500Time cursor blinks after typing in milliseconds
fontSizestring'clamp(1rem, 2vw, 1.25rem)'Font size
colorstring'#ffffff'Text color
loopbooleanfalseWhether to loop the animation
classNamestringundefinedAdditional CSS class