Magnetic Button

A button that pulls toward the cursor on hover.

Example.tsx

import { MagneticButton } from "@/components/better/magnetic-button"

export function Example() {
  return <MagneticButton strength={0.4}>Hover me</MagneticButton>
}

Dependencies

motion

Props

Prop	Type	Default	Description
children*	ReactNode	—
className	string	—
strength	number	0.4	How strongly the button follows the cursor (0–1).