Animate.css
We need your help! animate.css v4 is in the work with lots of improvements and some breaking changes, including CSS custom properties support (aka CSS variables) and classes prefix for a safer use. We need your feedback! You can follow the development on the
dev
branch and give your feedback on the issue tracker.
Every feedback is welcome!
Just-add-water CSS animation
animate.css
is a bunch of cool, fun, and cross-browser animations for you to use in your projects. Great for emphasis, home pages, sliders, and general just-add-water-awesomeness.
Installation
Install via npm:
$ npm install animate.css --save
or yarn:
$ yarn add animate.css
Usage
To use animate.css in your website, simply drop the stylesheet into your document's <head>
, and add the class animated
to an element, along with any of the animation names. That's it! You've got a CSS animated element. Super!
<head>
<link rel="stylesheet" href="animate.min.css">
</head>
or use a CDN hosted version by CDNJS
<head>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.2/animate.min.css">
</head>
Animations
To animate an element, add the class animated
to an element. You can include the class infinite
for an infinite loop. Finally you need to add one of the following classes to the element: