→ Tane Mahuta
→ About Our Company

About Our Company

Display your company data

This bootstrap css example is contributed by Tane Mahuta, on 17-Jul-2024. Component is made with bootstrap css v.5.3. It is responsive. similar terms for this example is about me

Tags: About us

Author Tane Mahuta

2.6k

v.5.3

Fork Fullscreen

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.7.2/font/bootstrap-icons.css">
<section class="about-us py-5 bg-light">
    <div class="container">
        <div class="row align-items-center">
            <div class="col-md-6">
                <h2 class="font-weight-bold mb-4">About Our Company</h2>
                <p class="text-muted mb-4">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla convallis egestas rhoncus. Donec facilisis fermentum sem, ac viverra ante luctus vel. Donec vel mauris quam.</p>
                <div class="row">
                    <div class="col-md-6">
                        <h5 class="text-primary">Our Mission</h5>
                        <ul class="list-unstyled">
                            <li><i class="bi bi-check-circle me-2 text-primary"></i>Innovative Solutions</li>
                            <li><i class="bi bi-check-circle me-2 text-primary"></i>Customer Satisfaction</li>
                            <li><i class="bi bi-check-circle me-2 text-primary"></i>Sustainable Practices</li>
                        </ul>
                    </div>
                    <div class="col-md-6">
                        <h5 class="text-primary">Our Vision</h5>
                        <ul class="list-unstyled">
                            <li><i class="bi bi-bullseye me-2 text-primary"></i>Global Reach</li>
                            <li><i class="bi bi-bullseye me-2 text-primary"></i>Industry Leadership</li>
                            <li><i class="bi bi-bullseye me-2 text-primary"></i>Continuous Growth</li>
                        </ul>
                    </div>
                </div>
                <a href="#" class="btn btn-primary mt-4">Learn More</a>
            </div>
            <div class="col-md-6">
                <img src="https://images.unsplash.com/photo-1552664730-d307ca884978?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3w0NzEyNjZ8MHwxfHNlYXJjaHw4fHxjb21wYW55fGVufDB8MHx8fDE3MjEyMTE5MDZ8MA&ixlib=rb-4.0.3&q=80&w=1080" alt="About Us" class="img-fluid rounded shadow">
            </div>
        </div>
        
        <div class="row mt-5">
            <div class="col-md-3 col-6 mb-4">
                <div class="text-center">
                    <i class="bi bi-people fs-1 text-primary mb-2"></i>
                    <h2 class="fw-bold">500+</h2>
                    <p class="text-muted">Clients</p>
                </div>
            </div>
            <div class="col-md-3 col-6 mb-4">
                <div class="text-center">
                    <i class="bi bi-briefcase fs-1 text-primary mb-2"></i>
                    <h2 class="fw-bold">1000+</h2>
                    <p class="text-muted">Projects</p>
                </div>
            </div>
            <div class="col-md-3 col-6 mb-4">
                <div class="text-center">
                    <i class="bi bi-trophy fs-1 text-primary mb-2"></i>
                    <h2 class="fw-bold">50+</h2>
                    <p class="text-muted">Awards</p>
                </div>
            </div>
            <div class="col-md-3 col-6 mb-4">
                <div class="text-center">
                    <i class="bi bi-globe fs-1 text-primary mb-2"></i>
                    <h2 class="fw-bold">20+</h2>
                    <p class="text-muted">Countries</p>
                </div>
            </div>
        </div>
    </div>
</section>

More Examples

About Section

Author:
Anonymous

1 year ago

2.3k

v.5.3
About us section
about us section with image

Author:
Kemaya m

1 year ago

2k

v.4.6
About us section

Author:
Kemaya m

1 year ago

2k

v.4.6
Navbar Scrollspy

Author:
java stories story

4 months ago

1.4k

v.5.3
Gradient Buttons

Author:
Prajwal Hallale

1 year ago

3.8k

v.5.3
Contact Us Page with Google Maps and Form Validation
HTML: Form Fields: Includes fields for name, email, and message. Google Map: A div with an id of map where the Google Map will be displayed. Feedback Elements: <div> elements for displaying validation messages and success messages. CSS: Styling: Adds padding for the contact section, sets the map height, and styles feedback and success messages. JavaScript: Google Maps Initialization: Uses the Google Maps JavaScript API to create and display a map centered at specified coordinates. Replace YOUR_GOOGLE_MAPS_API_KEY with your actual API key. Form Validation: Validates the input fields and displays appropriate messages if the input is invalid or missing. How to Use: Replace API Key: Insert your Google Maps API key in the script tag for Google Maps. Customize Coordinates: Update the latitude and longitude in the initMap function to reflect your actual location. Validation Rules: Customize validation logic as needed for your form requirements.

Author:
zobaidul kaziex

1 year ago

7.7k

v.4.6
Hero Parallaxx

Author:
java stories story

4 months ago

1.7k

v.5.3
404 made with bootstrap
error page template with boostrap

Author:
Anonymous

1 year ago

1.4k

v.5.3
Interactive left-Side Menu test
will need to be responsive

Author:
Ben Kremer

9 months ago

5.4k

v.5.3
Call to action section
basic full-width CTA

Author:
Mishti

1 year ago

5.3k

v.5.3
Featured Product Card

Author:
Prajwal Hallale

1 year ago

2.5k

v.5.3
Bootstrap with VideoJS player
Video player with buttons

Author:
Anonymous

1 year ago

1.7k

v.5.3

Didn't find component you were looking for?

Search from 300+ componenent

BootstrapExamples From the makers of tailwindflex.com

BootstrapExamples is a free library offering a diverse range of Bootstrap CSS components. Developed by the community, it's open for anyone to use.

Contacts

Email:

[email protected]

Links

Search

Resources

Free Tailwind CSS Components Free CSS Components

© 2026 BootstrapExamples. All Rights Reserved.

v1.3