Loading Colors

                    <div class="flex flex-wrap items-center justify-center gap-6 p-4">
  <!-- Default Blue -->
  <div class="flex flex-col items-center">
    <span class="text-sm text-gray-500 mb-2">Blue</span>
    <div class="w-8 h-8 border-4 border-blue-500 border-t-transparent rounded-full animate-spin"></div>
  </div>
  
  <!-- Red -->
  <div class="flex flex-col items-center">
    <span class="text-sm text-gray-500 mb-2">Red</span>
    <div class="w-8 h-8 border-4 border-red-500 border-t-transparent rounded-full animate-spin"></div>
  </div>
  
  <!-- Green -->
  <div class="flex flex-col items-center">
    <span class="text-sm text-gray-500 mb-2">Green</span>
    <div class="w-8 h-8 border-4 border-green-500 border-t-transparent rounded-full animate-spin"></div>
  </div>
  
  <!-- Yellow -->
  <div class="flex flex-col items-center">
    <span class="text-sm text-gray-500 mb-2">Yellow</span>
    <div class="w-8 h-8 border-4 border-yellow-500 border-t-transparent rounded-full animate-spin"></div>
  </div>
  
  <!-- Purple -->
  <div class="flex flex-col items-center">
    <span class="text-sm text-gray-500 mb-2">Purple</span>
    <div class="w-8 h-8 border-4 border-purple-500 border-t-transparent rounded-full animate-spin"></div>
  </div>
  
  <!-- Gray -->
  <div class="flex flex-col items-center">
    <span class="text-sm text-gray-500 mb-2">Gray</span>
    <div class="w-8 h-8 border-4 border-gray-500 border-t-transparent rounded-full animate-spin"></div>
  </div>
</div>