Typewriter Effect

Type Writer Effect

This component animates text as if it's being typed on a typewriter. Each character appears individually with a slight delay, creating a realistic typing effect.
Create 
Stunning 
UIs 
Fast. 

Installation

npx react-nex add TypewriterEffect

Example

Typewriter Effect without smoothness


 
 
 
 

Props

words

  • Type: { text: string; className?: string; }[]
  • Description: An array of objects representing the words to be typed. Each object can have a text property and an optional className property for styling.

className

  • Type: string
  • Description: The class name to be applied to the typewriter text container.

cursorClassName

  • Type: string
  • Description: The class name to be applied to the cursor.
TooltipAnimated Lines