- Dashboard
  - Version 1
  - Version 2
  - Version 3
  - Version 4
- UI Kits
  - Alerts
  - Dropdown
  - Buttons
  - Bootstrap tab
  - Cards
  - Card Metrics
  - Carousels
  - Collapsibles
  - Lists
  - Paginations
  - Popover
  - Progressbar
  - Tables
  - Tabs
  - Tooltip
  - Typography
  - Modals
  - Sliders
- Extra Kits
  - Image Cropper
  - Loaders
  - Ladda Buttons
  - Toastr
  - Sweet Alerts
  - User Tour
  - Upload
- Apps
  - contact List
  - Invoice
  - Inbox
  - Chat
  - Task Manager
    - Todo List
    - Task manager
    - Task manager list
    - Minimal ToDo
  - Ecommerce
    - Products
    - Product Details
    - Cart
    - Checkout
  - Contact
    - Contact Lists
    - Contact Grid
    - Contact Details
- Widgets
  - widget card
  - widget statistics
  - Widget List
  - Widget App
  - Weather App
- Charts
  - echarts
  - ChartJs
  - Apex Charts
    - Area Charts
    - Bar Charts
    - Bubble Charts
    - Column Charts
    - CandleStick Charts
    - Line Charts
    - Mix Charts
    - Mix Charts
    - PieDonut Charts
    - Radar Charts
    - RadialBar Charts
    - Scatter Charts
    - Sparkline Charts
- Forms
  - Basic Elements
  - Basic action bar
  - Form Layouts
  - Multi column forms
  - Input Groups
  - Form Validation
  - Smart Wizard
  - Smart Wizard
  - Tag Input
  - Rich Editor
- Datatables
- Sessions
  - Sign in
  - Sign up
  - Forgot
- Others
  - Not Found
  - User Profile
  - Blank Page
- Doc

# Progress Bar

- Componets
- Progress Bar

Progress components are built with two HTML elements, some CSS to set the width, and a few attributes.

#### Basic Progress Bar

#### Basic Progress Bar With Label

Add labels to your progress bars by placing text within the `.progress-bar`.

25%
50%
75%
100%

#### Basic Progress Bar With diff. Background

Use background utility classes to change the appearance of individual progress bars.

#### Labeled Progress Bar With diff. background

Use background utility classes to change the appearance of individual progress bars.

10%
25%
50%
75%
100%

#### Progress Bar With Multiple bars

Include multiple progress bars in a progress component if you need.

20%
35%
40%
15%
25%
30%
20%
20%
50%
15%
25%
30%

#### Striped Progress Bar

Add `.progress-bar-striped` to any `.progress-bar` to apply a stripe via CSS gradient over the progress bar’s background color

10%
25%
50%
75%
100%

#### Animated stripes Progress Bar

The striped gradient can also be animated. Add `.progress-bar-animated` to `.progress-bar` to animate the stripes right to left via CSS3 animations.

10%
25%
50%
75%
100%

#### Progress Bar width by class

Bootstrap provides a handful of utilities for setting width.

10%
25%
50%
75%
100%

Gull - Laravel + Bootstrap 4 admin template

Lorem ipsum, dolor sit amet consectetur adipisicing elit. Libero quis beatae officia saepe perferendis voluptatum minima eveniet voluptates dolorum, temporibus nisi maxime nesciunt totam repudiandae commodi sequi dolor quibusdam

Buy Gull HTML

© 2018 Gull HTML

All rights reserved

Search results
Headphone 1

Gadget

$300 $400

Sale

Headphone 1

Gadget

$300 $400

New

Headphone 1

Gadget

$300 $400

New

Headphone 1

Gadget

$300 $400

New