- ×
Javascript Animation Engine
Filed under animationShow All
anime.jsJavaScript animation engine | animejs.com
Anime.js (
/ˈæn.ə.meɪ/
) is a lightweight JavaScript animation library with a simple, yet powerful API.
It works with CSS properties, SVG, DOM attributes and JavaScript Objects.Getting started | Documentation | Demos and examples | Browser support
Getting started
Download
Via npm
$ npm install animejs --save
or manual download.
Usage
ES6 modules
import anime from 'animejs/lib/anime.es.js';
CommonJS
const anime = require('animejs');
File include
Link
anime.min.js
in your HTML :<script src="anime.min.js"></script>
Hello world
anime({ targets: 'div', translateX: 250, rotate: '1turn', backgroundColor: '#FFF', duration: 800 });
Documentation
- Targets
- Properties
- Property parameters
- Animation parameters
- Values
- Keyframes
- Staggering
- Timeline
- Controls
- Callbacks and promises
- SVG Animations
- Easing functions
- Helpers
Demos and examples
- CodePen demos and examples
- juliangarnier.com
- animejs.com
- Moving letters by @tobiasahlin
- Gradient topography animation by @crnacura
- Organic shape animations by @crnacura
- Pieces slider by @lmgonzalves
- Staggering animations
- Easings animations
- Sphere animation
- Layered animations
- anime.js logo animation
Browser support
Chrome Safari IE / Edge Firefox Opera 24+ 8+ 11+ 32+ 15+ Website | Documentation | Demos and examples | MIT License | © 2019 Julian Garnier.