CSS Loading Spinners

Simple loading spinners in pure CSS.

Usage

Add CSS Loading Spinners to your project using your favorite package manager:

$ npm i --save css-loading-spinners

or:

$ yarn add css-loading-spinners

Customization

If you need to change the color, size, or margin of the spinner, these are adjustable by changing the relevent variables:

:root {
  --spinner-color: /* your color, default #558B6E */;
  --spinner-size: /* your size, default 5rem */;
  --spinner-margin: /* your margin, default 1rem */;
  --spinner-speed: /* your speed, default 2s (time halved for flip-flop and signal animation) */;
}

Demo

View a demo at https://nai888.github.io/css-loading-spinners.