Animating SVG Paths of a Sketch via CSS

Posted on by Rob Stenzinger

Recently I've been exploring CodePen as a way to quickly experiment with HTML, CSS, and Javascript in a way that's fun and convenient.

My latest experiment was to learn more about animating SVG paths. The details of what I learned are in the code comments of this Codepen.

Here's the original sketch I converted to SVG using Cocopotrace and Adobe Illustrator:


And the Codepen experiment:

See the Pen SVG Sketch CSS Animation by Rob Stenzinger (@RobStenzinger) on CodePen.

Discussion off