Skip to content
40+ Handcrafted CSS animations dedicated for your loaders
CSS LiveScript Shell
Branch: master
Clone or download

README.md

loading.css

loading.css preview

60+ Handcrafted CSS animations that are seamless repeatable. All animations in loading.css are designed for both one time and infinitely played. Online demo could be found here (Loading.css - 50+ Seamless Repeatable CSS Animation · Loading.io ).

Loading.css is used in building GIF, APNG and animated SVG in loading.io. Check following links to see how it works:

You can find more about animation generation in loading.io.

Usage

  1. download and include loading.css:
    <link rel="stylesheet" type="text/css" href="loading.css"/>

you an use a CDN, such as, from jsDelivr:

    <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/gh/loadingio/loading.css@v2.0.0/dist/loading.min.css"/>
  1. Check the loading.css animation gallery for the animations you want to use. For example, say you want to use the spin animation

  2. Use the name as a CSS class prefixed with ld on the element you want to animate:

    <div class="ld ld-spin"></div>
  1. For more information, check out loading.css animation documentation.

LICENSE

MIT License

You can’t perform that action at this time.