Progress With outside label

            
<div class="space-y-1">
  <dl class="flex items-center justify-between">
    <dt class="font-medium text-secondary-700">Progress</dt>
    <dd class="text-sm text-secondary-500">35%</dd>
  </dl>
  <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 items-center justify-center bg-primary-500 text-xs text-white"></div>
  </div>
</div>