→ Anonymous
→ Skills & Expertise

Skills & Expertise

This bootstrap css example is contributed by Anonymous, on 11-Jun-2026. Component is made with bootstrap css v.4.6. It is responsive.

Tags: Progress Bar

Author Anonymous

v.4.6

Fork Fullscreen

<section class="skills-section">
        <div class="container">

<div class="row align-items-end mb-5">
                <div class="col-lg-12">
                    <h2 class="section-title text-center">Skills &amp; Expertise</h2>
                </div>
            </div>

<div class="container">
                <p>HTML</p>
                <div class="progress my-1">
                    <div class="progress-bar bg-success" role="progressbar" style="width: 60%" aria-valuenow="60"
                        aria-valuemin="0" aria-valuemax="100">60%</div>
                </div>
                <p>CSS</p>
                <div class="progress my-1">
                    <div class="progress-bar bg-info" role="progressbar" style="width: 55%" aria-valuenow="55"
                        aria-valuemin="0" aria-valuemax="100">55%</div>
                </div>
                <p>JS</p>
                <div class="progress my-1">
                    <div class="progress-bar bg-warning" role="progressbar" style="width: 30%" aria-valuenow="30"
                        aria-valuemin="0" aria-valuemax="100">30%</div>
                </div>
                <p>Python</p>
                <div class="progress my-1">
                    <div class="progress-bar bg-danger" role="progressbar" style="width: 80%" aria-valuenow="80"
                        aria-valuemin="0" aria-valuemax="100">80%</div>
                </div>
                <p>Analytics</p>
                <div class="progress my-1">
                    <div class="progress-bar bg-grey" role="progressbar" style="width: 85%" aria-valuenow="85"
                        aria-valuemin="0" aria-valuemax="100">85%
                    </div>
                </div>
            </div>
        </div>
        <div class="divider-line mb-4"></div>
        </div>
    </section>

More Examples

Animated Skills Progress Chart

Author:
Reza Farhadi

1 year ago

4.8k

v.5.3
Progress bars made with bootstrap 5.3

Author:
Anonymous

1 year ago

3k

v.5.3
Default progress bar designs by boostrap css

Author:
Omar Khaled

1 year ago

2.5k

v.5.3
Progress bars

Author:
Tane Mahuta

1 year ago

1.9k

v.5.3
Progress bars
Progress bar variations

Author:
Reza Farhadi

1 year ago

1.3k

v.5.3
Bootstrap tabs
tab navigation

Author:
Anonymous

11 months ago

1.5k

v.5.3
Service Page

Author:
Shahriar Noyon

3 weeks ago

47

v.4.6
ss skill

Author:
Gana JNsksk

3 weeks ago

47

v.4.6
about me gana

Author:
Gana JNsksk

4 weeks ago

52

v.4.6
Personl Details

Author:
Gana JNsksk

4 weeks ago

57

v.4.6
Pagination

Author:
Anonymous

1 year ago

2.1k

v.5.3
404 error page template

Author:
Ross Wille

1 year ago

4.4k

v.5.3

Didn't find component you were looking for?

Search from 300+ componenent