The path.animator is a custom Framer component that animates elements along SVG paths with precise control over timing, easing, and looping behavior. This component makes it easy to bring motion into hero sections, icons, backgrounds, and more.
Features
Customizable Path:
Define animation path using SVG path data.
Easing Functions:
Select from linear, easeIn, easeOut, and easeInOut for smooth animations.
Looping Options:
Loop continuously or alternate back and forth.
Duration Control:
Adjust animation speed.
Visual Customizations:
Change size, shape, color, border and background image of the animated object.