Magnet Lines
Interactive lines that follow your mouse pointer with magnetic effect
Configuring your account...
Please wait while we prepare everything for you
Usage
import MagnetLines from './MagnetLines';
<MagnetLines
rows={9}
columns={9}
containerSize="60vmin"
lineColor="#ffffff"
lineWidth="0.8vmin"
lineHeight="5vmin"
baseAngle={0}
style={{ margin: "2rem auto" }}
/>Props
| Prop | Type | Default | Description |
|---|---|---|---|
rows | number | 9 | Number of rows in the grid |
columns | number | 9 | Number of columns in the grid |
containerSize | string | '60vmin' | Size of the container |
lineColor | string | '#ffffff' | Color of the lines |
lineWidth | string | '0.8vmin' | Width of each line |
lineHeight | string | '5vmin' | Height of each line |
baseAngle | number | 0 | Base rotation angle in degrees |