SVG animations can get a little complicated, but these libraries make it extremely simple for anyone to add animation to their site. In this post i’ve collected 10 Javascript SVG animation libraries that allow you to create some really impressive animations that can literally take your animations and UIs to the next level.
jQuery DrawSVG
Lightweight, simple to use jQuery plugin to animate SVG paths.
Vivus.js
Vivus is a lightweight JavaScript class that allows you to animate SVGs, giving them the appearence of being drawn. There are a variety of different animations available, as well as the option to create a custom script to draw your SVG in whatever way you like.
Animation Engine for Vector Graphic
Enliven ’em is a jQuery plugin which lets you animate any vector graphic presented as SVG files in many different ways when your vector illustrations become visible in a user’s browser viewport. Also you can allow an animation to be repeated when user click or tap your graphic.
Lazy Line Painter
A jQuery plugin for path animation using the CSS.
Trigons
Trigons is a flexible JS script which lets you create modern and stylish abstract SVG images with optional animations. Trigons script is coded as plugin for d3.js library (d3js.org) and it uses d3’s build-in method of Delaunay triangulation for creating colored and animated abstract images. No jQuery needed.
Segment
A little JavaScript class (without dependencies) to draw and animate SVG path strokes.
Trigons
Trigons is a flexible JS script which lets you create modern and stylish abstract SVG images with optional animations. Trigons script is coded as plugin for d3.js library (d3js.org) and it uses d3’s build-in method of Delaunay triangulation for creating colored and animated abstract images. No jQuery needed.
SVG.JS
A lightweight library for manipulating and animating SVG. Svg.js has no dependencies and aims to be as small as possible.
Animate Plus
Animate Plus is a CSS and SVG animation library for modern browsers. Animate Plus is performant and lightweight (3KB gzipped), making it particularly well-suited for mobile.
Walkway.js
An easy way to animate SVG elements.
Wheelnav
Wheel navigation JavaScript library built on SVG . It can be tab navigation, pie menu, sub menu and more