stackpicks.dev
Back to gallery
juliangarnier/anime preview
juliangarnier
juliangarnier/

anime

JavaScript animation engine

Stars
68.7k
Forks
4.6k
Watchers
68.7k
Open issues
106
JavaScriptMIT master Updated 3 weeks ago~18 stars/day lifetime
Editor's take

Lightweight JavaScript animation engine. ~66k stars. Great for SVG and DOM animation without React-specific bindings. Smaller community than GSAP, but the API is approachable and the bundle is tiny.

Use this if

You want a small, framework-agnostic animation library for marketing sites or vanilla JS projects.

Skip if

You are in React — Motion is more idiomatic, similar bundle size, larger community.

Animation & Motion
Topics
animationanimecanvascssjavascriptjavascript-librarysvg
Quick install
# Install via npm / pnpm / bun:
pnpm add anime
# or
npm install anime

Inferred from JavaScript · always double-check against the official README below.

README — rendered from juliangarnier/anime

Anime.js

Anime.js V4 logo animation

Anime.js is a fast, multipurpose and lightweight JavaScript animation library with a simple, yet powerful API.
It works with CSS properties, SVG, DOM attributes and JavaScript Objects.

NPM Downloads jsDelivr hits (npm) GitHub Sponsors

Sponsors

Anime.js is 100% free and is only made possible with the help of our sponsors. Help the project become sustainable by sponsoring us on GitHub Sponsors.

Platinum sponsors

Silver sponsors

Get featured here by becoming a GitHub Sponsor.

Usage

Anime.js V4 works by importing ES modules like so:

import {
  animate,
  stagger,
} from 'animejs';

animate('.square', {
  x: 320,
  rotate: { from: -180 },
  duration: 1250,
  delay: stagger(65, { from: 'center' }),
  ease: 'inOutQuint',
  loop: true,
  alternate: true
});
Anime.js code example

V4 Documentation

The full documentation is available here.

V3 Migration guide

You can find the v3 to v4 migration guide here.

NPM development scripts

First, run npm i to install all the necessary packages. Then, execute the following scripts with npm run <script>.

script action
dev Watches for changes in src/**/*.js, bundles the ESM version to lib/ and creates type declarations in types/
dev:test Runs dev and test:browser concurrently
build Bundles ESM / UMD / CJS / IIFE versions to lib/ and creates type declarations in types/
test:browser Starts a local server and runs all browser-related tests
test:node Starts Node-related tests
open:examples Starts a local server to browse the examples locally

© Julian Garnier | MIT License

Live data via GitHub REST API · Cached 30 min · Created 14 Mar 2016