Lightweight CSS Animation Framework – Efecss.css

Category: Animation , CSS & CSS3 | March 20, 2017
Views Total:555 views
Official Page:Go to website
Last Update:March 20, 2017


Lightweight CSS Animation Framework – Efecss.css


Efecss.css is a tiny CSS library for adding CSS3 based animations to any elements just like the famous animate.css.

Install it via NPM:

$ npm install --save effecss-pure-css

How to use it:

Import the efecss.css into your html page.

<link href="efecss.css" rel="stylesheet">

Add the following CSS classes to the elements you want to animate.

  • slide-up-in
  • slide-down-in
  • slide-left-in
  • slide-right-in
  • slide-up-out
  • slide-down-out
  • slide-left-out
  • slide-right-out
  • fade-in
  • fade-out
  • zoom-in-radial
  • zoom-in
  • zoom-out-radial
  • zoom-out
  • pulse
  • bounce-top-in
<h2 class="slide-up-in">slide-up-in</h2>

Specify the animation should be played infinite times:

<h2 class="forever slide-up-in">slide-up-in</h2>

You Might Be Interested In:

Leave a Reply