Skip to main content

​
Overview

The @midudev/tailwind-animations package has been renamed to tailwind-animations. The scoped package is now deprecated and maintained only as a backward compatibility shim.
The @midudev/tailwind-animations package is deprecated. While it remains available for compatibility, all new projects should use tailwind-animations.

​
Why the Change?

The package was renamed as part of the v1.0 release to:
  • Simplify package naming and discovery
  • Align with Tailwind CSS v4’s architecture
  • Establish the package as the official animations solution
  • Remove organizational scoping for broader community adoption

​
Version Compatibility

For Tailwind CSS v3

Use @midudev/[email protected]This is the last version supporting Tailwind CSS v3.

For Tailwind CSS v4

Use tailwind-animations@latestRequired for Tailwind CSS v4 support.

​
Migration Steps

​
For Tailwind CSS v4 Projects

If you’re already using Tailwind CSS v4:
1

Uninstall Scoped Package

Remove the old scoped package:
npm uninstall @midudev/tailwind-animations
2

Install New Package

Install the official package:
npm install tailwind-animations
3

Update Imports

Update your CSS import statement:Before:
globals.css
@import 'tailwindcss';
@import '@midudev/tailwind-animations';
After:
globals.css
@import 'tailwindcss';
@import 'tailwind-animations';
4

Update package.json References

If you have any scripts or tooling that references the old package name, update them:
package.json
{
  "dependencies": {
    "tailwind-animations": "^1.0.0"
  }
}
5

Test Your Application

Run your application to verify all animations work correctly. No class name changes are required.

​
For Tailwind CSS v3 Projects

If you’re still using Tailwind CSS v3:
The new tailwind-animations package requires Tailwind CSS v4. For v3 support, continue using @midudev/[email protected].
1

Stay on v0.2.0

Keep using the scoped package at version 0.2.0:
npm install @midudev/[email protected]
2

Plan Your Upgrade

When you’re ready to upgrade to Tailwind CSS v4, follow the complete migration guide.

​
What Stays the Same

​
All Class Names

No changes to any animation class names: 
<!-- These work exactly the same -->
<div class="animate-fade-in">Content</div>
<div class="animate-slide-in-bottom animate-delay-300">Content</div>

​
All Animation Types

Every animation remains available:
  • Fade animations
  • Slide animations
  • Zoom animations
  • Rotate animations
  • Bounce animations
  • All other animation utilities

​
All Modifiers

All timing and behavior modifiers work identically:
  • animate-delay-*
  • animate-duration-*
  • animate-iteration-count-*
  • animate-fill-mode-*
  • animate-bezier-*
  • Timeline utilities

​
Side-by-Side Comparison

npm install @midudev/[email protected]

// tailwind.config.js
module.exports = {
  plugins: [
    require('@midudev/tailwind-animations')
  ]
}

​
Automated Migration

You can use a simple find-and-replace in your project:
  1. Search for: @midudev/tailwind-animations
  2. Replace with: tailwind-animations
  3. Update package version to v1.0+
# Quick replacement with sed (Unix/Mac)
find . -type f -name '*.css' -exec sed -i '' 's/@midudev\/tailwind-animations/tailwind-animations/g' {} +

​
Deprecation Timeline

  • January 2026: tailwind-animations v1.0 released
  • Current: @midudev/tailwind-animations available as compatibility shim
  • Future: Scoped package will continue to work but won’t receive updates
The scoped package will remain on npm indefinitely for backward compatibility, but all new features and updates will only be added to tailwind-animations.

​
Frequently Asked Questions

No, it will remain available for backward compatibility, but it won’t receive updates beyond v0.2.0.
No, all class names remain exactly the same. Only the package name and installation method change.
Yes, if you have projects on different Tailwind versions:
  • Use @midudev/[email protected] for Tailwind v3
  • Use tailwind-animations@latest for Tailwind v4
Please upgrade to tailwind-animations v1.0+ and Tailwind CSS v4. Bug fixes will only be applied to the new package.

​
Need Help?

If you encounter any issues during migration:

Build docs developers (and LLMs) love

Get started for freeTalk to us