Randomized Text

Text component with randomized character reveal animation.

Introducing Spell UILoremipsumdolorsitametconsectetur,adipisicingelit.Animiarchitectosolutamodifacilisfugitpossimuscommodi!Ipsamdelectusunderepellendus.

Installation

pnpm dlx shadcn@latest add @spell/randomized-text

Examples

Split By

Open in

BY CHARACTERSLorem ipsum dolor sit amet consectetur adipisicing elit. Perferendis debitis ipsam saepe incidunt laboriosam eaque quasi commodi beatae excepturi quos!

BY WORDSLoremipsumdolorsitametconsecteturadipisicingelit.Perferendisdebitisipsamsaepeinciduntlaboriosameaquequasicommodibeataeexcepturiquos!

Usage

import { RandomizedText } from "@/components/randomized-text";

<RandomizedText>You can just ship things.</RandomizedText>

Props

Prop	Type	Default
`children`	`string`	-
`className`	`string`	-
`split`	`'words' \| 'chars'`	`'words'`
`delay`	`number`	`0.2`
`inView`	`boolean`	`false`