Rainbow spinner loader - JavaScript based SVG animation - live preview
See documentation HERE
Duration of one cycle (milliseconds):
Minimal opacity:
%
Maximal opacity:
%
(Animation changes the visibility of the elements between the minimal and maximal percent values.)
Element invisibility (minimal opacity) during the cycle:
1
2
3
4
5
Relative size of elements in the circle:
%
Number of elements in the circle:
(Graphics and colors are optimized for 12 elements.)
One color
(You can change it to any color in
css/loader-spinner.css
file.)
SHAPE 1:
SHAPE 2:
SHAPE 3:
SHAPE 4:
SHAPE 5:
SHAPE 6:
SHAPE 7:
SHAPE 8:
SHAPE 9:
SHAPE 10:
SHAPE 11:
SHAPE 12:
SHAPE 13:
SHAPE 14:
SHAPE 15:
SHAPE 16:
SHAPE 17:
SHAPE 18:
SHAPE 19:
SHAPE 20: