Anime.js

Founded by Julian Garnier in 2016

Animate HTML elements, SVG paths, and CSS properties using lightweight JavaScript code

Pricing model

Free

Rating

★ People love it

Time to value

Quick Setup (< 1 hour)

You can use Anime.js to build smooth, lightweight animations for modern websites and web applications. It lets you manipulate HTML elements, CSS transform properties, and SVG paths using a straightforward JavaScript API. You can choreograph intricate sequences with the timeline feature, apply staggered delays to grid elements, and connect visual effects directly to page scrolling. It also includes utilities for dragging elements with realistic spring physics, morphing vector graphics, and adapting motion styles across responsive breakpoints to create polished, interactive digital experiences.

What Anime.js does

Write declarative animation code for HTML and SVG elementsAnimate CSS transform properties independently without conflictsSynchronize callback functions across animation timelinesGenerate spring physics curves for realistic bounce and flick motionsMorph vector paths into new shapes using SVG path interpolationConfigure scroll threshold triggers to scrub or start animationsTimeline API to orchestrate and synchronize multi-step animationsSVG utilities for vector shape morphing, line drawing, and motion pathsScroll Observer API to trigger and scrub animations based on viewport positionBuilt-in staggering functions for staggered grid and timeline animationsDraggable API to drag, snap, and throw elements with spring physicsModular architecture allowing developers to import only required packagesScope API to adapt animation sequences across media query breakpoints