Progress Bar - Midone - Tailwind HTML Admin Template

Pages

Users

Arnold Schwarzenegger

arnoldschwarzenegger@left4code.com

Robert De Niro

robertdeniro@left4code.com

Kate Winslet

katewinslet@left4code.com

Brad Pitt

bradpitt@left4code.com

Products

Notifications

Arnold Schwarzenegger

05:09 AM

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500

Robert De Niro

01:10 PM

There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomi

Kate Winslet

03:20 PM

It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem

Brad Pitt

01:10 PM

There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomi

Al Pacino

01:10 PM

There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomi

Progressbar

Basic Progressbar

Show example code

  HTMLOpenTagdiv class="w-full h-2 bg-gray-400 dark:bg-dark-1 rounded-full"HTMLCloseTag HTMLOpenTagdiv class="w-1/2 h-full bg-theme-1 rounded-full"HTMLCloseTagHTMLOpenTag/divHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class="w-full h-2 bg-gray-400 dark:bg-dark-1 rounded-full mt-3"HTMLCloseTag HTMLOpenTagdiv class="w-2/3 h-full bg-theme-1 rounded-full"HTMLCloseTagHTMLOpenTag/divHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class="w-full h-2 bg-gray-400 dark:bg-dark-1 rounded-full mt-3"HTMLCloseTag HTMLOpenTagdiv class="w-3/4 h-full bg-theme-1 rounded-full"HTMLCloseTagHTMLOpenTag/divHTMLCloseTag HTMLOpenTag/divHTMLCloseTag

Progressbar with Label

Show example code

50%

60%

70%

  HTMLOpenTagdiv class="w-full h-4 bg-gray-400 dark:bg-dark-1 rounded"HTMLCloseTag HTMLOpenTagdiv class="w-1/2 h-full bg-theme-1 rounded text-center text-xs text-white"HTMLCloseTag50%HTMLOpenTag/divHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class="w-full h-4 bg-gray-400 dark:bg-dark-1 rounded mt-3"HTMLCloseTag HTMLOpenTagdiv class="w-2/3 h-full bg-theme-1 rounded text-center text-xs text-white"HTMLCloseTag60%HTMLOpenTag/divHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class="w-full h-4 bg-gray-400 dark:bg-dark-1 rounded mt-3"HTMLCloseTag HTMLOpenTagdiv class="w-3/4 h-full bg-theme-1 rounded text-center text-xs text-white"HTMLCloseTag70%HTMLOpenTag/divHTMLCloseTag HTMLOpenTag/divHTMLCloseTag

Progressbar Height

Show example code

  HTMLOpenTagdiv class="w-full h-1 bg-gray-400 dark:bg-dark-1 rounded-full"HTMLCloseTag HTMLOpenTagdiv class="w-1/2 h-full bg-theme-1 rounded-full"HTMLCloseTagHTMLOpenTag/divHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class="w-full h-2 bg-gray-400 dark:bg-dark-1 rounded mt-3"HTMLCloseTag HTMLOpenTagdiv class="w-2/3 h-full bg-theme-1 rounded"HTMLCloseTagHTMLOpenTag/divHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class="w-full h-3 bg-gray-400 dark:bg-dark-1 rounded mt-3"HTMLCloseTag HTMLOpenTagdiv class="w-3/4 h-full bg-theme-1 rounded"HTMLCloseTagHTMLOpenTag/divHTMLCloseTag HTMLOpenTag/divHTMLCloseTag

Progressbar Color

Show example code

  HTMLOpenTagdiv class="w-full h-2 bg-gray-400 dark:bg-dark-1 rounded-full"HTMLCloseTag HTMLOpenTagdiv class="w-1/2 h-full bg-theme-1 rounded-full"HTMLCloseTagHTMLOpenTag/divHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class="w-full h-2 bg-gray-400 dark:bg-dark-1 rounded mt-3"HTMLCloseTag HTMLOpenTagdiv class="w-2/3 h-full bg-theme-9 rounded"HTMLCloseTagHTMLOpenTag/divHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class="w-full h-2 bg-gray-400 dark:bg-dark-1 rounded mt-3"HTMLCloseTag HTMLOpenTagdiv class="w-3/4 h-full bg-theme-12 rounded"HTMLCloseTagHTMLOpenTag/divHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class="w-full h-2 bg-gray-400 dark:bg-dark-1 rounded mt-3"HTMLCloseTag HTMLOpenTagdiv class="w-3/4 h-full bg-theme-6 rounded"HTMLCloseTagHTMLOpenTag/divHTMLCloseTag HTMLOpenTag/divHTMLCloseTag