Tutorials Pricing Log in Sign up
Easy-to-Use SVG Path Animation Generator
SVGator is an online SVG animation software that doesn’t require any coding skills.
Start your 14-day trial. No credit card required
Animate stroke paths and create self-drawing or self-erasing effects in just a few clicks
The best thing in SVGator is that there is no steep learning curve, downloadable software or plug-in. You can create a path based animation online, within minutes, without any coding skills.
You will find our tutorial on how to animate a line with SVGator here.
Looking for a demo?
How to animate an SVG stroke path with SVGator
User-friendly interface for stunning line animations
Set an offset animation between the value of the path's length and 0, then hide the path by adding its length as value for the stroke dashes animator.
The Stroke offset and Stroke dashes animators will create and move the dashes along an SVG path, resulting in a self-drawing line animation
Self-drawing & erasing animation
Create a combination of self-drawing and self-erasing animations by using multiples of the path’s value for the offset animator.
Feel free to experiment with different dasharray values to create a dashed line and move the line along its path with the offset animator.
Export CSS as the animation type
SVGator simplifies the way you animate SVG by not requiring any coding skills. You can work in a friendly interface while it generates a single animated SVG file with CSS as the animation type.
Make your SVG interactive by choosing to start the animation on mouse-over or on click. Decide whether to loop or repeat once the animation.
SVGator exports a single file, so it’s easy to add it to your website!
There is more!
© 2020 SVGator. All Rights Reserved.
Terms of Service
Move on Path