Magnetic Nav
Nav links magnetically attract the cursor; elastic spring snaps back on leave.
Component Showcase
Magnetic Nav
Nav links magnetically attract the cursor; elastic spring snaps back on leave.
GSAPElastic
All systems online
Nav links magnetically attract the cursor; elastic spring snaps back on leave.
Nav links magnetically attract the cursor; elastic spring snaps back on leave.
Select how you want to add this component to your project
import { MagneticNav } from "@/components/magnetic-nav";
export default function Page() {
return (
<main className="flex min-h-screen items-center justify-center bg-[#050505] p-8">
<MagneticNav />
</main>
);
}Feed this prompt to Claude, ChatGPT, or Gemini to quickly write custom integrations, layouts, or configure props for this component on your system.