Text reveal

Preview

Build enchanting, interactive interfaces that mesmerize users and elevate the digital experience with the power of Mahou

pnpm dlx shadcn@latest add https://mahou-ui.kevintakeda.com/r/text-reveal.json

pnpm dlx shadcn@latest add https://mahou-ui.kevintakeda.com/r/text-reveal.json

import { TextReveal } from "@/components/ui/text-reveal"

<TextReveal
  text="Build enchanting interfaces with Mahou"
  className="[--color-accent:var(--color-primary)]" />

Prop	Type	Default	Description
`text`	`string`	`-`	The text to be revealed
`start`	`string`	`10%`	The entry position of the animation
`offset`	`number`	`10`	The animations characters offset
`offsetMultiplier`	`number`	`1.1`	The offset multiplier
`className`	`string`	`-`	The class name to be applied to the component