Box Reveal Animation

Docs

Sliding box animation that reveals text behind it.

Magic UI.

UI library for Design Engineers

-> 20+ free and open-source animated components built withReact,Typescript,Tailwind CSS, andMotion.
-> 100% open-source, and customizable.

import { BoxReveal } from "@/components/magicui/box-reveal";

<BoxReveal>Box Reveal</BoxReveal>

Prop	Type	Default	Description
`className`	`string`	`-`	The class name to be applied to the component
`boxColor`	`string`	`#5046e6`	Color of the box overlaying the text
`duration`	`number`	`0.5`	Durations (seconds) of the animation

Contribute