sigilUI

Type Writer

Typewriter text effect with blinking cursor. Types, pauses, deletes, and loops through multiple strings.

@sigil-ui/componentsReact

Preview

Live preview Interactive

Import

import { TypeWriter } from "@sigil-ui/components";

Usage

<TypeWriter words={["npx @sigil-ui/cli init", "sigil preset cobalt"]} />

Custom speed

<TypeWriter
  words={["Hello", "World"]}
  speed={80}
  deleteSpeed={30}
  pauseDuration={2000}
  cursor
/>

No loop

<TypeWriter words={["Type once and stop"]} loop={false} />

Props

PropTypeDefaultDescription
wordsstring[]—Strings to type
speednumber60Typing speed (ms/char)
deleteSpeednumber40Deleting speed (ms/char)
pauseDurationnumber1500Pause after full word in ms
loopbooleantrueLoop through words
cursorbooleantrueShow blinking cursor

Respects prefers-reduced-motion — shows first word immediately when reduced motion is preferred.