Author: | zuramai |
---|---|
Views Total: | 2,744 views |
Official Page: | Go to website |
Last Update: | October 19, 2020 |
License: | MIT |
Preview:

Description:
Just another set of 6 pretty cool loading animations that can be used as loading spinners while loading content in the document. Written in pure CSS/CSS3.
Loading Animations Included:
- Spinner With Logo
- Vertical Bars
- Horizontal Bars
- Water Filling
- Pulse
- Logo Bouncing
How to use it:
1. Insert loader’s CSS styles into your document. You can find all loaders in the style.css
.
2. Add the loader to the webpage. That’s it.
<!-- SPINNER WITH LOGO --> <div class="loading-wrapper"> <div class="loading-devover"> </div> <div class="img"> <img src="assets/favicon.png" alt="" srcset=""> </div> </div> <!-- VERTICAL BARS --> <div class="loading-wrapper d-flex align-items-center justify-content-center"> <div class="loading-bar"></div> </div> <!-- HORIZONTAL BARS --> <div class="loading-wrapper2"> <div class="loading-bar1"></div> <div class="loading-bar2"></div> <div class="loading-bar3"></div> </div> <!-- WATER FILLING --> <div class="loading-wrapper"> <div class="loading-pouring"> </div> </div> <!-- LOGO BOUNCING --> <div class="loading-wrapper d-flex justify-content-center"> <div class="loading-bouncing "> <img src="assets/favicon.png" alt="" srcset=""> </div> </div> <!-- PULSE --> <div class="loading-wrapper d-flex justify-content-center align-items-center"> <div class="loading-pulse "> <img src="assets/favicon.png" alt="" srcset=""> </div> </div>