Status Sizes

                    <div class="flex flex-col space-y-4">
  <div class="flex items-center space-x-3">
    <span class="inline-block w-1.5 h-1.5 bg-green-500 rounded-full"></span>
    <span class="text-xs text-gray-700">Extra Small</span>
  </div>
  
  <div class="flex items-center space-x-3">
    <span class="inline-block w-2 h-2 bg-green-500 rounded-full"></span>
    <span class="text-xs text-gray-700">Small</span>
  </div>
  
  <div class="flex items-center space-x-3">
    <span class="inline-block w-3 h-3 bg-green-500 rounded-full"></span>
    <span class="text-sm text-gray-700">Medium (Default)</span>
  </div>
  
  <div class="flex items-center space-x-3">
    <span class="inline-block w-4 h-4 bg-green-500 rounded-full"></span>
    <span class="text-sm text-gray-700">Large</span>
  </div>
  
  <div class="flex items-center space-x-3">
    <span class="inline-block w-5 h-5 bg-green-500 rounded-full"></span>
    <span class="text-sm text-gray-700">Extra Large</span>
  </div>
</div>