Components
Hover Reveal Button
An interactive button with a circular reveal effect that follows your cursor. A white circle grows from the mouse entry point and fills the entire button on hover, with smooth entrance and exit animations.
import { HoverRevealButton } from "@/components/ui/hover-reveal-button";
export default function HoverRevealButtonDemo() {
return (
<div className="bg-white rounded-xl">
<div className="flex flex-col items-center justify-center min-h-[400px] gap-8 p-8">
<HoverRevealButton className="px-12 py-4 text-base rounded">
Button
</HoverRevealButton>
</div>
</div>
);
}