Updated: Magnet Lines
By Steven Van ·
The React Bits component now fills its container, adds arrow and compass shapes and a 3D tilt, and installs through shadcn in JS or TS.
React Bits has updated Magnet Lines so it now works as a background that fills its container. The original square version is still available.
How the lines behave
The lines swing toward the cursor on springs, ripple outward from it and spin with each click. The component page describes it as a field of magnetic lines.
New options
- New field modes
- Arrow and compass shapes
- A 3D tilt
Installing
The component can be added in JavaScript or TypeScript, with plain CSS or Tailwind. The TypeScript and Tailwind version installs with npx shadcn@latest add @react-bits/MagnetLines-TS-TW.
React Bits
An open-source collection of 200+ animated, interactive React components and micro-interactions.
View React Bits →