Loading Spinner Generator

Generate simple, elegant, pure CSS loading animations.

<!-- HTML --> <div class="spinner"></div> /* CSS */ .spinner { width: 40px; height: 40px; border-radius: 50%; border: 4px solid #e5e7eb; /* light-gray */ border-top-color: #4f46e5; animation: spinner-ring 1s linear infinite; } @keyframes spinner-ring { to { transform: rotate(360deg); } }