→ Arturo
→ Team Section with Bootstrap 5

Team Section with Bootstrap 5

This bootstrap css example is contributed by Arturo, on 22-Dec-2024. Component is made with bootstrap css v.5.3. It is responsive.

Tags: Team

Author Arturo

427

v.5.3

Fork Fullscreen

<section class="py-5">
    <div class="container">
        
        <div class="row text-center mb-5">
            <div class="col-12">
                <h2 class="section-title">Meet Our Team</h2>
                <p class="text-muted">Dedicated professionals working together to achieve excellence</p>
            </div>
        </div>

<div class="row g-4">
            
            <div class="col-lg-3 col-md-6">
                <div class="team-member text-center p-4">
                    <img src="https://randomuser.me/api/portraits/women/64.jpg" alt="Team Member 1" class="mb-4 shadow">
                    <h5 class="mb-1">Sarah Johnson</h5>
                    <p class="text-muted mb-3">CEO & Founder</p>
                    <p class="small mb-3">Leading our company's vision and strategy with over 15 years of
                        experience.</p>
                    <div class="social-links">
                        <a href="#"><i class="fab fa-linkedin-in"></i></a>
                        <a href="#"><i class="fab fa-twitter"></i></a>
                        <a href="#"><i class="fab fa-facebook-f"></i></a>
                    </div>
                </div>
            </div>

<div class="col-lg-3 col-md-6">
                <div class="team-member text-center p-4">
                    <img src="https://randomuser.me/api/portraits/men/64.jpg" alt="Team Member 2" class="mb-4 shadow">
                    <h5 class="mb-1">Michael Chen</h5>
                    <p class="text-muted mb-3">Tech Lead</p>
                    <p class="small mb-3">Driving innovation and technical excellence in all our projects.</p>
                    <div class="social-links">
                        <a href="#"><i class="fab fa-linkedin-in"></i></a>
                        <a href="#"><i class="fab fa-github"></i></a>
                        <a href="#"><i class="fab fa-twitter"></i></a>
                    </div>
                </div>
            </div>

<div class="col-lg-3 col-md-6">
                <div class="team-member text-center p-4">
                    <img src="https://randomuser.me/api/portraits/women/12.jpg" alt="Team Member 3" class="mb-4 shadow">
                    <h5 class="mb-1">Emily Martinez</h5>
                    <p class="text-muted mb-3">Design Director</p>
                    <p class="small mb-3">Creating beautiful and intuitive designs that users love.</p>
                    <div class="social-links">
                        <a href="#"><i class="fab fa-linkedin-in"></i></a>
                        <a href="#"><i class="fab fa-dribbble"></i></a>
                        <a href="#"><i class="fab fa-instagram"></i></a>
                    </div>
                </div>
            </div>

<div class="col-lg-3 col-md-6">
                <div class="team-member text-center p-4">
                    <img src="https://randomuser.me/api/portraits/men/4.jpg" alt="Team Member 4" class="mb-4 shadow">
                    <h5 class="mb-1">David Wilson</h5>
                    <p class="text-muted mb-3">Marketing Manager</p>
                    <p class="small mb-3">Developing strategies that connect our brand with audiences.</p>
                    <div class="social-links">
                        <a href="#"><i class="fab fa-linkedin-in"></i></a>
                        <a href="#"><i class="fab fa-twitter"></i></a>
                        <a href="#"><i class="fab fa-instagram"></i></a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

More Examples

Minimal Team Section
On hover reveal colors

Author:
Arturo

2 months ago

336

v.5.3
Interactive Service Cards | Bootstrap 5.3
Modern Bootstrap 5.3 component with elegant card rotations and hover animations. Perfect for featuring services, products, or team members

Author:
Anonymous

2 months ago

1.4k

v.5.3
navbar
navbar 2 line

Author:
almounkez

2 months ago

299

v.4.6
Interactive image carousel using Bootstrap 5
Full-width carousel with automatically sliding images

Author:
Prajwal Hallale

11 months ago

580

v.5.3
Pricing Cards

Author:
Anonymous

4 months ago

795

v.5.3
Music Player
Working music player With start top buttons and progress bar

Author:
Prajwal Hallale

7 months ago

2.9k

v.5.3
Navbar
a responsive navbar with search

Author:
Prajwal Hallale

11 months ago

1.1k

v.5.3
bootstrap quiz template (Interactive)
Interactive MCQ Quiz show results at the end

Author:
Arturo

2 months ago

680

v.5.3
bootstrap 5 confirm modal

Author:
Anonymous

2 months ago

2.3k

v.5.3
Copy Code Section
Code block with working copy option

Author:
Kemaya m

7 months ago

824

v.5.3
Social media buttons
Beautiful and simple social media buttons

Author:
Maria Garcia

7 months ago

1.7k

v.5.3
Simple Footer

Author:
Anonymous

11 months ago

525

v.4.6

Didn't find component you were looking for?

Search from 300+ componenent