Char Motion React: an ASCII character animation library for react
npm install @char-motion/reactChar(acter) Motion is a collection of ASCII character based text animations/effects for use in React applications.
To read the docs, see examples, and get more information, check out the website.
npm i @char-motion/react
import { Txt } from "@char-motion/react";
Hello World!
more examples here
Effects are split into different categories based on when they trigger. This package is relatively new so there aren't too many effects yet.
Effects that trigger when the Txt object is first initialized.
- typed sweep: characters type in as if written in a terminal
- randomized: characters appear in random order with an intermediate jumbled state
- number sweep: numbers shuffle and stabilize one by one
Effects that trigger when the Txt object is hovered over.
- typed sweep: a cursor character moves left to right through the text and idly flickers at the end
- twinkle: characters are randomly swapped out and put back at regular intervals
- shuffle: text between delimiter characters is randomly shuffled
- case: switches text to upper or lower case
Effects that trigger when the child string is changed.
- retype: deletes the characters right to left and retypes them left to right
Web home page logo made with patorjk's text to ASCII art generator.