Close

progress bar style 12

This is another template of a web form with a progress bar, designed using HTML and CSS. Class progress-bar of the progress class has been added into the code to create and style the progress bar. The body is given a background color of #dad9d4. The label of the progress bar has the styles of font size as 15px, background color as #fff, width as 20%, height as 100%, border radius as 100px 0 0 100px, font color as #000, line height as 40px, letter spacing as 1px, text align as center, and text transform as uppercase to automatically transform it to uppercase. The progress line is given a color of #fff, border radius of 100px, and margin top as 40px whereas the bar is given the styles of border radius as 0 100px 100px 0, font size as 15px, font weight as bold, line height as 40px, text color as #fff, and an animation value of animate-positive 2s. Each progress value number is given a background color of #ec4251, #73cd21, #2e9ce0, and #eea921, respectively.

Post Comment or Questions

Lorem ut labore et dolore magna aliqua. Ut enim ad minim veniam.

Your email address will not be published. Required fields are marked *