AniJS – Declarative handling library for CSS animations


AniJS is a declarative handling library for CSS animations. Created by @dariel_noel


  • Easy to use.
  • Compact – around 7.7kb after gzipping.
  • There is no need for third party libraries.
  • Speed of development.
  • Better integration between coders and designers.
  • Supports iPad, iPhone, Android and all the modern browsers


Add the script the head of the document and also include Animate.css library or any CSS animation styles.

<link rel="stylesheet" href="">
<script src="anijs-min.js"></script>

And now add anijs-data tag to any HTML element.

    <header data-anijs="if: click, do: flipInY animated">
    <nav data-anijs="if: scroll, on: window, do: swing animated, to: footer">
    <div id="main" data-anijs="if: DOMContentLoaded, on: document, do: swing animated, after: holdAnimClass">
        if: DOMContentLoaded, on: document, do: swing animated
    <script src="bower_components/anijs/dist/anijs-min.js"></script>

Codepen Example