Add a bouncing entrance animation to a logo or hero image without writing CSS keyframes.
Make a notification fade out smoothly when dismissed by toggling a class name.
Create a wobbling button effect on hover to draw attention to a call-to-action.
Build accessible animations that automatically disable for users with motion sensitivity settings enabled.
Animate.css is a small library of ready-made animations written in pure CSS. CSS is the language web pages use to control how things look; an animation in CSS is a rule that tells the browser to gradually change a property over time, for example to fade an element in or make it bounce. The library bundles many of those animations and gives each one a simple class name, so you can drop the stylesheet into your site and trigger an effect by adding a class to an element. The README's tagline calls it just-add-water CSS animation. It is a cross-browser library, meaning the animations are written so they look the same across the major web browsers. Animation classes are organized by category, such as fades and bounces, and named in camelCase. Crucially, the library respects the prefers-reduced-motion media query: when a visitor has turned on the reduce-motion setting in their operating system because they are sensitive to movement, supported browsers will turn off the transitions automatically with no extra work from the developer. Installation is via the npm or yarn package managers, and full documentation lives on the project's website animate.style. You would use Animate.css when you want to add visual flair to a website, a logo that bounces in, a notification that fades out, a button that wobbles on hover, without writing the underlying animation rules yourself. It is licensed under the Hippocratic License. The project lists Daniel Eden as the creator and a small core team of maintainers.
Generated 2026-05-18 · Model: sonnet-4-6 · Verify against the repo before relying on details.