Typewriter Text

The classic typewriter with a blinking cursor, cycling phrases. For hero lines that name audiences or uses.

Install

Included with Creative: needs your API key. Initialize and log in once.

Terminal

npx @galactrex/ui add typewriter-text

Example

import { TypewriterText } from "@/components/galactrex/typewriter-text";

Built for <TypewriterText text={["designers", "studios", "teams"]} />

Installs to components/galactrex/typewriter-text.tsx, with the shared motion primitives beside it.

Source for this component comes with its plan. Install it with the command above, or open your licensed copy here.

Prop	Type	Default	Description
`text`	`string \| string[]`	—	Phrase or phrases.
`as`	`ElementType`	`"span"`	Element.
`speed / deleteSpeed`	`number`	`18 / 40`	Characters per second.
`hold`	`number`	`1400`	Ms a phrase stays.
`loop`	`boolean`	`true`	Keep cycling.
`cursor`	`"bar" \| "block" \| "underscore" \| "none"`	`"bar"`	Cursor.
`className`	`string`	—	Extra classes for the outer element.