Loading Animation Created With Pure CSS

CSS Loading Animation is a set of pretty cool loading animations that can be used as loading spinners when loading content into a document.

How to make use of it:

1. Add the loader to the webpage.

<!-- SPINNER WITH LOGO -->
<div class="loading-wrapper">
  <div class="loading-devover">
  </div>
  <div class="img">
    // Add Image Here
  </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 ">
     // Add Image Here
  </div>
</div>
<!-- PULSE -->
<div class="loading-wrapper d-flex justify-content-center align-items-center">
  <div class="loading-pulse ">
    // Add Image Here
  </div>
</div>

Loading Animations In Pure CSS, CSS Loading Animation Plugin/Github