Progress Bar
You can use the progress bars on their own or in combination with other widgets.
Basic
0%
25%
50%
75%
100%
Multiple bars
Progress bar labels
25%
1/2
You're almost there!
You did it!
Meh
Wow!
Cool
20%
!!
Progress bar max
1 of 5
50 of 135
75 of 111
463 of 500
Various (40) of 55
5
15
10
10
Progress bar striped
Sizing
Rounded
Progress color
Progress bar multi
Plain
With Labels
Meh
Wow!
25%
LOOK OUT!!
Stripes and Animations
Stripes
Animated Stripes
Plain
Progress animated

Layout Options

  • Full Sidebar
    Removes sidebar layout spacing.
  • Pills Page Navigation Style
    Changes the page sub navigation style to pills!

Sidebar Options

  • Choose Color Scheme

Main Content Options

  • Color Schemes

Servers Status

Server Load 1

Server Load 2

Server Load 3

Live Statistics
43
Packages
65
Dropped
18
Invalid

File Transfers

  • TPSReport.docx
  • Latest_photos.zip
  • Annual Revenue.pdf
  • Analytics_GrowthReport.xls

Tasks in Progress

  • Wash the car
    Rejected
    Written by Bob
  • Task with hover dropdown menu
    By Johnny
    NEW
  • Badge on the right task
    This task has show on hover actions!
    Latest Task
  • Go grocery shopping
    A short description ...
  • Development Task
    Finish React ToDo List App
    69

Urgent Notifications

All Hands Meeting

Yet another one, at 15:00 PM

Build the production release
NEW

Something not important
+

This dot has an info state