# Magnetic Field Hero

> A minimal hero over the magnetic-field background component: a Canvas 2D field of iron filings that turn along the curved lines between two drifting magnetic poles. The cursor takes over one pole, spring physics pull the filings toward it, and every click sends a radial shockwave through the grid. An oversized headline sits beside a short intro and two Turn Arrow block buttons. Every field setting passes through the field prop; the ink follows the theme, the field pulses on its own when idle, it pauses offscreen, and reduced motion gets one settled frame.

A paid shadcn/ui block sold by the [@beste-ui](https://ui.beste.co/?utm_source=shadcn.exchange) registry, listed on [shadcn.exchange](https://shadcn.exchange/r/beste-ui/hero211).

- Page, with a preview: https://shadcn.exchange/r/beste-ui/hero211
- Screenshot: https://abzjhwgwpdpz7ua5.public.blob.vercel-storage.com/shots/beste-ui/hero211-light-1d551d6a64874db7.png
- Listed: 2026-10-13

## Buy and install

@beste-ui sells this block, and its code is not on shadcn.exchange. Buy it from the registry, which installs it for those who have: https://shadcn.exchange/out/beste-ui/hero211

## Dependencies

- npm packages: `clsx`, `framer-motion`, `lucide-react`, `tailwind-merge`
- Registry items: `button`