Spinners

This HTML structure showcases different loading animations with customizable size, color, and speed:

<div class="loader"></div>
<div class="loader-red"></div>
<div class="loader loader-medium loader-blue"></div>
<div class="loader loader-large loader-green"></div>
<div class="loader loader-small loader-red"></div>
<div class="loader loader-medium loader-blue loader-fast"></div>
<div class="loader loader-large loader-green loader-normal"></div>
<div class="loader loader-small loader-red loader-slow"></div>

Key Features

1. Color Customization: Different classes (.loader-red, .loader-blue, etc.) change the loader's color.

2. Size Variability: Use .loader-small, .loader-medium, and .loader-large to adjust the loader's size.

3. Speed Control: Classes like .loader-fast, .loader-normal, and .loader-slow modify the animation speed.

4. Combinable Classes: Easily combine size, color, and speed classes for diverse loader configurations.