High-Performance CSS Loader & Spinner Generator

w-[60px] h-[60px] border-[4px] border-gray-200 border-t-[#6366f1] rounded-full animate-spin

.loader {
  width: 60px; height: 60px;
  border: 4px solid #f3f3f3;
  border-top: 4px solid #6366f1;
  border-radius: 50%;
  animation: spin 2.00s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

$color: #6366f1;
$size: 60px;
$speed: 2.00s;

.loader {
  width: $size; height: $size;
  border: 4px solid #f3f3f3;
  border-top: 4px solid $color;
  border-radius: 50%;
  animation: spin 2.00s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }