Progress Bar
Visually display progress.
<x-progress-bar progress="75" />
Control the progress bar fill by setting the progress attribute.
<x-progress-bar progress="25" />
Control the progress bar size by setting the size attribute.
<div class="flex flex-col gap-8">
<x-progress-bar progress="75" size="sm" />
<x-progress-bar progress="75" />
<x-progress-bar progress="75" size="lg" />
</div>
| Attribute |
Default |
Description |
progress |
0 |
int
Control the progress bar fill. |
size |
default |
string
Possible values default, sm, or lg. |