Skip to content
Animadio CSS Framework
Branch: master
Clone or download
Latest commit ea55ddd Jun 6, 2019

Animadio Logo

Animadio CSS Framework

  • Eight types of selectors working with hover, focus, active & checked states
  • Hundreds of class combinations by concatenation
  • Flexbox & Grid systems included with common options
  • Click anywhere on the page to enable & disable any design effect anywhere else
  • Management of keyframes animations & their options
  • Complete & simple customization with directly modifiable CSS variables
  • More than 99% of pure CSS ; so all of that without JavaScript, it's a joke ?... No ?!

GitHub Version David Dev Dependencies Travis Build

GitHub Last Commit Codacy Code Quality CodeClimate Maintainability


Package Managers

NPM Version

NPM Weekly Downloads NPM Montly Downloads NPM Yearly Downloads

NPM : npm i animadio
Yarn : yarn add animadio

Meteor Project

Meteor : meteor add animadio:animadio

Packagist Version

Composer : composer require animadio/animadio


jsDelivr Weekly Downloads jsDelivr Montly Downloads jsDelivr Yearly Downloads

Full Version

Grid Version

Elements Version

States Version


Latest Release

git clone

Repo Size


The main library distribution is :

  • For development : dist/animadio.css
  • For production : dist/min/animadio.min.css

CSS Code Size CSS Minified Size

But if you only need a part of Animadio, you can use one of those dist files :

  • To get Global + Grid : dist/animadio-grid.css for dev or dist/min/animadio-grid.min.css for prod
  • To get Global + Elements : dist/animadio-elements.css for dev or dist/min/animadio-elements.min.css for prod
  • To get Global + States : dist/animadio-states.css for dev or dist/min/animadio-states.min.css for prod

CSS Only

Animadio is a CSS framework whose library is composed only of CSS source code: jQuery, or even Javascript, are not included or needed in production...

Grunt is the only JavaScript app used in the framework developement side for recursive tasks (concat, source map, webkit & min) to build the library file (but it can be used to concat CSS elements of your choice)

You can simply use the library & if you want or if you need : you can overload the CSS variables.

GitHub Top Language


Animadio has continuous support & community networks will give all news !

Project Maintained GitHub Commit Activity


Animadio uses PostCSS with autoprefixer to provide a maximum of compatibility for all main browsers, including mainly Firefox, Chrome & Opera, secondarily Edge, Safari & Explorer (for some effects, especially all Skew animations)


CodePen : @animadio

GitHub Stars


Slack :

Twitter Follow


Documentation will arrive as soon as possible !

WebSite Status


Issues can be created here

GitHub Open Issues

But for issues about Parse Error, see this before doing anything :

For the W3C CSS Validator :

For the W3C Nu HTML Validator :

For CSS Lint :

Pull Requests

And Pull Requests can be created there

GitHub Open Pull Requests


Animadio needs you if you like it : sends pull requests on GitHub to improve it !!

GitHub Contributors


Animadio is maintained under the Semantic Versioning 2.0.0

GitHub Version


Philippe Beck

WebSite Status GitHub Followers Twitter Follow


Lisa Lecieux

WebSite Status GitHub Followers Twitter Follow


Code released under the MIT License

GitHub License

Support on Beerpay

Hey dude! Help me out for a couple of 🍻!

Beerpay Beerpay

You can’t perform that action at this time.