Progress Color

            
<div class="space-y-5">
  <div class="relative flex h-2 w-full overflow-hidden rounded-full bg-secondary-200">
    <div role="progressbar" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100" style="width: 25%" class="flex h-full bg-primary-500"></div>
  </div>
  <div class="relative flex h-2 w-full overflow-hidden rounded-full bg-secondary-200">
    <div role="progressbar" aria-valuenow="35" aria-valuemin="0" aria-valuemax="100" style="width: 35%" class="flex h-full bg-green-500"></div>
  </div>
  <div class="relative flex h-2 w-full overflow-hidden rounded-full bg-secondary-200">
    <div role="progressbar" aria-valuenow="45" aria-valuemin="0" aria-valuemax="100" style="width: 45%" class="flex h-full bg-yellow-500"></div>
  </div>
  <div class="relative flex h-2 w-full overflow-hidden rounded-full bg-secondary-200">
    <div role="progressbar" aria-valuenow="55" aria-valuemin="0" aria-valuemax="100" style="width: 55%" class="flex h-full bg-red-500"></div>
  </div>
  <div class="relative flex h-2 w-full overflow-hidden rounded-full bg-secondary-200">
    <div role="progressbar" aria-valuenow="65" aria-valuemin="0" aria-valuemax="100" style="width: 65%" class="flex h-full bg-gray-500"></div>
  </div>
</div>