Button Colors

                    <!-- Primary Button -->
<button class="inline-flex items-center justify-center px-4 py-2 font-medium text-white bg-blue-600 rounded-lg hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50 transition-colors">
  Primary
</button>

<!-- Secondary Button -->
<button class="inline-flex items-center justify-center px-4 py-2 font-medium text-white bg-purple-600 rounded-lg hover:bg-purple-700 focus:outline-none focus:ring-2 focus:ring-purple-500 focus:ring-opacity-50 transition-colors">
  Secondary
</button>

<!-- Success Button -->
<button class="inline-flex items-center justify-center px-4 py-2 font-medium text-white bg-green-600 rounded-lg hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-green-500 focus:ring-opacity-50 transition-colors">
  Success
</button>

<!-- Danger Button -->
<button class="inline-flex items-center justify-center px-4 py-2 font-medium text-white bg-red-600 rounded-lg hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-opacity-50 transition-colors">
  Danger
</button>

<!-- Warning Button -->
<button class="inline-flex items-center justify-center px-4 py-2 font-medium text-gray-900 bg-yellow-500 rounded-lg hover:bg-yellow-600 focus:outline-none focus:ring-2 focus:ring-yellow-400 focus:ring-opacity-50 transition-colors">
  Warning
</button>

<!-- Info Button -->
<button class="inline-flex items-center justify-center px-4 py-2 font-medium text-white bg-sky-500 rounded-lg hover:bg-sky-600 focus:outline-none focus:ring-2 focus:ring-sky-400 focus:ring-opacity-50 transition-colors">
  Info
</button>

<!-- Light Button -->
<button class="inline-flex items-center justify-center px-4 py-2 font-medium text-gray-900 bg-gray-200 rounded-lg hover:bg-gray-300 focus:outline-none focus:ring-2 focus:ring-gray-300 focus:ring-opacity-50 transition-colors">
  Light
</button>

<!-- Dark Button -->
<button class="inline-flex items-center justify-center px-4 py-2 font-medium text-white bg-gray-800 rounded-lg hover:bg-gray-900 focus:outline-none focus:ring-2 focus:ring-gray-700 focus:ring-opacity-50 transition-colors">
  Dark
</button>