Magic Button

A pushable 3D button with a layered shadow/edge that lifts on hover and dips on press, with an optional animated rainbow-gradient edge glow.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Magic Button to your project and fits it to your theme.

import { MagicButton } from "@/components/ui/magic-button";

export default function MagicButtonDemo() {
  return <MagicButton variant="default">Get started</MagicButton>;
}