NexoreUIv1.8.6
InstallationComponents61IconsTemplatesNEWNexore MakeAI
Create ProjectSTUDIOGitHub
NexoreUI
61 comps
Create Project
Studio
Installation
Components Overview
60+
Icons
300+
Categories6 groups
Button
Input
Checkbox
AI
Select
AI
Switch
Slider
Rating
File Upload
Card
Accordion
Tabs
Table
Stepper
Scroll Area
Navigation
Dock
Data Display
Aurora Border Card
AI
Aurora Search Pill
AI
AI Prompt Input
AI
Command
Interactive Code Block
AI
Pro AI
AI
Theme: cyan
Studio
DocsTyping Animation

Typing Animation

Typewriter-style text animations.

NextBlur Fade
On This Page
Quick Actions
Project Studio
New
Nexore Make (AI)Source on GitHub

Typing Animation

Animates typing and deleting effects for a sequence of texts.

Interactive Playground

Live CanvasInteractive
|
Controls(6)
texts
text

Comma-separated list of texts to cycle through

speed
number

Typing speed in milliseconds per character

deleteSpeed
number

Deleting speed in milliseconds per character

pauseDuration
number

Pause duration in milliseconds after typing a full text

loop
boolean
Toggle state:

Whether to loop the texts indefinitely

cursor
boolean
Toggle state:

Whether to display the blinking cursor

Generated JSX
Source
import { TypingAnimation } from "nexoreui"

<TypingAnimation />

Default Typing Cycle

|
component.tsx
1

Fast Typing Speed

|
component.tsx
1

No Loop / Run Once

|
component.tsx
1

Without Cursor

component.tsx
1

Gradient Custom Styling

|
component.tsx
1

API Reference

PropertyTypeDefaultDescription
textsstring[]-Array of text strings to type out sequentially.
speednumber100Typing speed in milliseconds per character.
deleteSpeednumber50Deleting speed in milliseconds per character.
pauseDurationnumber2000Pause duration in milliseconds after typing a full text.
loopbooleantrueWhether to loop the sequence of texts indefinitely.
cursorbooleantrueWhether to display the blinking cursor.