Progress
Documentation and examples for using Bootstrap custom progress bars featuring support for stacked bars, animated backgrounds, and text labels.
Basic Progress
Use variant prop for different colors of Progress bar.
Animated Progress
Use <HkProgress> for animated progressbar.
Rounded Progress
Use rounded prop in <HkProgress for rounded progressbar.
Striped Progress
Add .progress-bar-striped to any .progress-bar to apply a stripe via CSS gradient over the progress bar’s background color. Add .progress-bar-animated to .progress-bar to animate the stripes right to left via CSS3 animations.
Progress sizes
Size whatever you want just add size ="xs", "sm", "md", "lg", "xl" prop in <HkProgress> component or you can just add height utility classes.
Progress with labels
Add labels on top of your progress bars by placing text within the .progress-label inside .progress-lb-wrap and for label left add class .lb-side-left with .progress-wrap .
Multiple Bars
Include multiple progress bars in a progress component if you need.