juliangarnier/anime

Media & Design

A small JavaScript library for animating CSS, SVG, DOM attributes and plain objects in web interfaces and browser-based visuals.

73,943
5,004
JavaScript
MIT
10 years old

Anime.js is a reasonable choice if you need scripted motion in the browser and want one small API to cover DOM, CSS, SVG and JavaScript objects. It is a general-purpose animation engine, not a timeline editor or a design tool, so expect to write code rather than drag keyframes.

The problem

A developer wants a button to slide, a logo to draw itself, and a set of list items to cascade into place, all reacting to user input. Doing that with hand-written CSS transitions gets awkward once timing must be computed at runtime, when values change dynamically, or when the target is an SVG path rather than a styled element. The step that changes is orchestration: instead of maintaining a growing pile of keyframe rules, you describe the animation in JavaScript. The result is one animation that can be paused, looped, reversed or restarted from application logic.

What's different

Anime.js targets four kinds of targets through a single API: CSS properties, SVG, DOM attributes and plain JavaScript objects. That last one matters more than it sounds, because it lets the same timing model drive non-DOM state, such as a Three.js object or a canvas render loop, without switching to a separate animation system. The README's example shows the intended style: a target selector, a property map with a from value, duration, and stagger with a from: 'center' origin to spread delays across matching elements project instructions.

The V4 package is ESM-first: you import animate and stagger rather than relying on a global. That suits modern bundlers and is a notable change for anyone upgrading from V3, which is why a dedicated migration guide exists migration guide. The trade-off is that you are writing code, so complex cutscene-style sequencing is left to you; the library supplies the motion primitives and timing helpers, not a visual authoring surface.

Who should try it

Good fit: a front-end developer who needs interactive, state-driven motion on a landing page, data visualization, or SVG illustration, and wants to avoid maintaining many separate CSS animations. The API's small surface makes it plausible to adopt in an afternoon for one component.

Poor fit: a designer expecting a timeline UI, or a team that needs a complete motion design system with visual previews. This is a library, and the primary documentation is the website documentation, so the workflow is edit-and-reload rather than composure by mouse. If your motion is simple hover effects on static elements, native CSS may be enough.

Requirements and limitations

V4 is distributed as ES modules, so the README's usage path assumes a build setup or import-map-style loading. The repository provides development, build and test scripts covering ESM, UMD, CJS and IIFE bundles project instructions, so older script-tag setups can still consume built artifacts, but the documented entry point is the module import. Setting up the repo for development requires Node and npm; using the published package does not require cloning it.

Ongoing care is mostly upgrade care: V3 to V4 changed the import and API shape, and the migration guide is the place to check before moving an existing codebase migration guide. The license is MIT license, which is permissive, but this review makes no claims about long-term maintenance beyond what the repository shows. The README excerpt is sponsor-heavy and does not list browser compatibility tables or performance benchmarks, so those need to be checked in the full documentation if they affect your target environment.

HotRepo's take

HotRepo's records cover only one daily-board observation, on 2026-10-27, when the project stood at 73,924 stars with a +72 daily gain. That single dated snapshot cannot show whether interest is rising, fading or stable; persistence cannot yet be judged from the supplied history. The adoption question is simpler: if you want one JavaScript animation API for DOM, CSS, SVG and object state, the V4 import path and the V3 migration guide are the two documentation points to read before committing.

Hacker News

JavaScript Animation Engine
▲ 1 · 0 comments · June 19, 2018
Lightweight JavaScript Animation Engine
▲ 1 · 0 comments · June 29, 2016

Written by AI from the project's README, updated October 27, 2026. The project's own docs are the source of truth.