---
name: Anime.js
slug: animejs
url: "https://dontmakeitugly.com/resources/animejs"
website: "https://animejs.com"
github: "https://github.com/juliangarnier/anime"
docs: "https://animejs.com/documentation/"
npm: "https://www.npmjs.com/package/animejs"
type: package
categories:
  - motion
tags:
  - animation
  - vanilla
  - svg
  - stagger
  - timelines
  - lightweight
frameworks:
  - vanilla
  - astro
  - agnostic
pricing: free
license: MIT
openSource: true
agentFriendly: excellent
agentAccessMethods:
  - documentation
  - github
  - npm
installCommand: npm install animejs
difficulty: intermediate
dateAdded: "2026-09-02"
lastVerified: "2026-09-02"
---

# Anime.js

A lightweight, framework-free animation library with a beautiful API.

- Type: Package
- Categories: Motion
- Pricing: Free · License: MIT
- Open source: yes
- Works with: Vanilla JS/CSS, Astro, Framework agnostic, JavaScript

## What it is

Anime.js animates CSS properties, SVG, DOM attributes and JavaScript objects with timelines, staggering and easing, all in a small package with no framework dependency. Version 4 rewrote it in modern modular ES.

## Why it's here

The right pick for vanilla sites, Astro, or anywhere Motion's React focus doesn't fit and GSAP feels like too much. The staggering helpers are lovely.

## Best for

- vanilla JS sites
- SVG animation
- staggered reveals
- Astro projects

## Links

- Website: https://animejs.com
- Docs: https://animejs.com/documentation/
- GitHub: https://github.com/juliangarnier/anime
- npm: https://www.npmjs.com/package/animejs

## Can my agent use this?

Yes. Public docs and source. Mention the version (v4) so your agent uses the modern modular API.

Agent friendliness: Excellent. Public docs, public source or an installable package. An agent can read, install and implement this directly.
Access methods: Docs, GitHub, npm.
Install: `npm install animejs`

## Prompt to hand your agent

```text
Use Anime.js as a design and implementation reference for this project.

What it is: A lightweight, framework-free animation library with a beautiful API.

Website: https://animejs.com
Documentation: https://animejs.com/documentation/
GitHub: https://github.com/juliangarnier/anime
npm: https://www.npmjs.com/package/animejs
Install: npm install animejs

Use it specifically for:
- vanilla JS sites
- SVG animation
- staggered reveals
- Astro projects

How you can access it: Docs, GitHub, npm.
Works with: Vanilla JS/CSS, Astro, Framework agnostic.
License: MIT. Respect it.

Read the documentation before writing code, and use the current version's API. Install it properly rather than re-implementing it. Adapt the defaults to this project's existing design tokens, typography, spacing and accessibility requirements. Do not blindly copy the entire resource.
```

## Related

- [GSAP](https://dontmakeitugly.com/resources/gsap.md): The professional-grade animation toolkit, now free including all plugins.
- [AutoAnimate](https://dontmakeitugly.com/resources/autoanimate.md): One line of code that animates list changes for you.
- [Lenis](https://dontmakeitugly.com/resources/lenis.md): Smooth scrolling that doesn't fight the browser.
- [Liquid Glass JS](https://dontmakeitugly.com/resources/liquid-glass-js.md): Apple's Liquid Glass look on the web: real-time refraction, blur and masking in WebGL.

Anime.js is an independent resource listed by Don't Make It Ugly. We link to it; we aren't affiliated with it. Pricing and licence details are as understood at the time of listing; check the official site.
