Progress components are built with two HTML elements, some CSS to set the width, and a few attributes. We don’t use the HTML5 progress element, ensuring you can stack progress bars, animate them, and place text labels over them.
We use the .fui-progress as a wrapper to indicate the max value of the progress bar.
We use the inner .progress-bar to indicate the progress so far.
The .progress-bar requires an inline style, utility class, or custom CSS to set their width.
Striped Bars
To get stripe on Progress bar simply add .striped class on .progress-bar
50%
Animated Striped Bars
To get animated stripe on Progress bar simply add .striped .animated-stripe class on .progress-bar