Progress

Displays an indicator showing the completion progress of a task, typically displayed as a progress bar.

 
<div class="progress sz-md max-w-sm w-full" aria-valuemax="100" aria-valuemin="0" aria-valuenow="66" aria-valuetext="66%" role="progressbar" style="transform:translateZ(0)">
  <div class="progress-indicator variant-primary w-[66%]"></div>
</div>

Reference

Progress

The progress component have the following props

Prop
Type
Usage
size
enum
sz-[size]
variant
enum
intent-[intent]

Neutral

 
<div class="progress sz-md max-w-sm w-full" aria-valuemax="100" aria-valuemin="0" aria-valuenow="66" aria-valuetext="66%" role="progressbar" style="transform:translateZ(0)">
  <div class="progress-indicator variant-neutral w-[66%]"></div>
</div>

Size xl

 
<div class="progress sz-md max-w-sm w-full" aria-valuemax="100" aria-valuemin="0" aria-valuenow="66" aria-valuetext="66%" role="progressbar" style="transform:translateZ(0)">
  <div class="progress-indicator variant-success w-[66%]"></div>
</div>