Installation
Examples
2 Border Beams
Reverse
Spring Animation
Usage
showLineNumbers
showLineNumbers
Props
Border Beam
| Prop | Type | Default | Description |
|---|---|---|---|
className | string | - | Custom class to apply to the component |
size | number | 50 | Size of the beam |
duration | number | 6 | Duration of the animation in seconds |
delay | number | 0 | Delay before the animation starts |
colorFrom | string | #ffaa40 | Start color of the beam gradient |
colorTo | string | #9c40ff | End color of the beam gradient |
transition | Transition | - | Custom motion transition configuration |
style | React.CSSProperties | - | Custom CSS styles to apply |
reverse | boolean | false | Whether to reverse animation direction |
initialOffset | number | 0 | Initial offset position (0-100) |
borderWidth | number | 1 | Border width of the beam |