Documentation

View documentation

Installation

Please see the full installation instructions for detailed steps and examples.

Quick start with NPM

First, install the plugin via npm:

npm install tw-animate

Import

Second, import it alongside Tailwind CSS in your CSS file:

/* tailwind css v4.x */
@import "tailwindcss";
@import "tw-animate";

Or, if you are using Tailwind CSS v3.x or the legacy JavaScript configuration file, import the plugin like this:

// tailwind.config.js
module.exports = {
  // ...
  plugins: [
    require('tw-animate')
  ],
}

Credits

• Animate.css – for animation utilities & keyframes – used under the MIT license.
• Transform.tools – for converting Animate.css to JS – used under the MIT license.
• animated-tailwindcss – fork this to use tailwind 4 the MIT license.