Bulma Demo
Bulma Code
Output
<!DOCTYPE html> <html> <head> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.8.0/css/bulma.min.css"> </head> <body> <div class="container"> <progress class="progress is-primary" value="45" max="100">45% fill</progress> <progress class="progress is-danger" value="70" max="100">70% fill</progress> <progress class="progress is-info" value="30" max="100">30% fill</progress> <progress class="progress is-warning" value="10" max="100">40% fill</progress> <progress class="progress is-link" value="60" max="100">60% fill</progress> <progress class="progress is-success" value="80" max="100">80% fill</progress> </div> </body> </html>
45% fill
70% fill
30% fill
40% fill
60% fill
80% fill