SVG Drawing

Dynamic SVGs? No Problem!

To animate an SVG line simply set its CSS attributes of stroke-dasharray and stroke-dashoffset to the length of the path. Then create a tween that animates the stroke-dashoffset property to zero.

Of course you can also manipulate any other CSS property just like you'd expect. For more information about the special SVG CSS properties check out this great article.

view source