Pure CSS/LESS Loading Spinners – CSSPIN

Author: webkul
Views Total: 1,696 views
Official Page: Go to website
Last Update: November 22, 2016
License: MIT


Pure CSS/LESS Loading Spinners – CSSPIN


CSSPIN is a collection of 10+ animated single-element loading spinners & loaders that are easy to style and customize via CSS / LESS.

How to use it:

Install the CSSPIN via NPM or Bower:

npm install csspin
bower install csspin

Or directly include the core CSS file in the document and we’re ready to go.

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

Create the loading spinners on the webpage as follows:

<div class="cp-spinner cp-round"></div>  
<div class="cp-spinner cp-pinwheel"></div>  
<div class="cp-spinner cp-balls"></div>
<div class="cp-spinner cp-bubble"></div>  
<div class="cp-spinner cp-flip"></div>  
<div class="cp-spinner cp-hue"></div>
<div class="cp-spinner cp-skeleton"></div>  
<div class="cp-spinner cp-eclipse"></div>  
<div class="cp-spinner cp-boxes"></div>
<div class="cp-spinner cp-morph"></div>

See also  Google Inspired 4-Dot Loading Indicators In Pure CSS

Leave a Reply

Your email address will not be published. Required fields are marked *