Components
/
Border Trail
Border Trail
An animated border effect that travels around the perimeter of an element.
Examples
Basic
A simple border trail effect on a card.
Hover to see the trail
Card with Loading State
Border trail with a loading skeleton inside.
Custom Colors
Border trail with custom gradient colors and glow effect.
Custom gradient trail
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
| className | string | - | Additional CSS classes for the trail element |
| size | number | 60 | Size of the trail element in pixels |
| transition | Transition | - | Custom Framer Motion transition configuration |
| onAnimationComplete | () => void | - | Callback when animation completes |
| style | React.CSSProperties | - | Inline styles for the trail element |