→ Ad Apon7
→ mision and vission

mision and vission

This bootstrap css example is contributed by Ad Apon7, on 07-May-2026. Component is made with bootstrap css v.5.3.

Tags: Hero

677

v.5.3

<section class="py-5" style="background-color: #0f1221; font-family: 'Inter', sans-serif;">
    <div class="container py-5 text-center">
        
        <div class="mb-5">
            <h6 class="text-uppercase text-danger fw-bold ls-widest mb-3" style="letter-spacing: 3px; font-size: 0.85rem;">WHAT DRIVES ME</h6>
            <h1 class="display-4 fw-bold text-white mb-4" style="font-family: 'Playfair Display', serif;">
                Career <span class="text-danger">Mission & Vision</span>
            </h1>
            <div class="mx-auto bg-danger mb-4" style="height: 3px; width: 60px;"></div>
            <p class="text-secondary mx-auto mb-5" style="max-width: 600px; font-size: 1.1rem; line-height: 1.6;">
                My professional philosophy centers on continuous growth, client satisfaction, and impactful digital craftsmanship.
            </p>
        </div>

<div class="row g-4 justify-content-center">
            
            
            <div class="col-lg-5 col-md-6 text-start">
                <div class="h-100 p-5 rounded-4 border-0 shadow-lg" style="background-color: #161b33; transition: transform 0.3s;">
                    <div class="mb-4 d-inline-flex align-items-center justify-content-center p-3 rounded-3" style="background-color: #242a4d; width: 54px; height: 54px;">
                        
                        <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#dc3545" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                            <circle cx="12" cy="12" r="10"></circle>
                            <circle cx="12" cy="12" r="6"></circle>
                            <circle cx="12" cy="12" r="2"></circle>
                        </svg>
                    </div>
                    <h3 class="h4 fw-bold text-white mb-3">My Mission</h3>
                    <p class="text-secondary mb-0" style="font-size: 0.95rem; line-height: 1.7;">
                        To deliver world-class digital solutions that solve real business problems. I am committed to excellence, clean code, and user-centered design in every project I undertake.
                    </p>
                </div>
            </div>

<div class="col-lg-5 col-md-6 text-start">
                <div class="h-100 p-5 rounded-4 border-0 shadow-lg" style="background-color: #161b33;">
                    <div class="mb-4 d-inline-flex align-items-center justify-content-center p-3 rounded-3" style="background-color: #242a4d; width: 54px; height: 54px;">
                        
                        <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#dc3545" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                            <path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path>
                            <circle cx="12" cy="12" r="3"></circle>
                        </svg>
                    </div>
                    <h3 class="h4 fw-bold text-white mb-3">My Vision</h3>
                    <p class="text-secondary mb-0" style="font-size: 0.95rem; line-height: 1.7;">
                        To become a globally recognized digital architect who bridges the gap between complex technology and human experience — creating products that matter and inspire.
                    </p>
                </div>
            </div>

</div>
    </div>
</section>

More Examples

Elon Musk 2
hero to last home

Author:
RAHAT RAHMAN OFICIAL

4 months ago

534

v.4.6
Existing Client Section

Author:
istiakahmedchowdhury10

1 month ago

92

v.4.6
Parsonal PortFolio Full WebSite

Author:
Zahid Hasan Riyad

1 month ago

319

v.5.3
Section Title

Author:
istiakahmedchowdhury10

1 month ago

130

v.4.6
Hero Section with Animations
Interactive hero section with animated elements, key statistics, and modern styling

Author:
Isaac Winslow

1 year ago

7.7k

v.5.3
Clean hero section with image

Author:
Prajwal Hallale

2 years ago

4k

v.5.3
Gradient Hero Section
A visually stunning hero section with a gradient background and a call-to-action button.

Author:
Prajwal Hallale

2 years ago

5.9k

v.5.3
Clean hero section with image
tugas

Author:
Anonymous

1 year ago

1.6k

v.5.3
aboutContwnt

Author:
Sahin Miah

3 months ago

794

v.4.6
portfoilo page

Author:
Ad Apon7

3 months ago

365

v.5.3
portfolio page

Author:
Md. Hasibur Rahman

2 months ago

160

v.4.6
Personal Portfolio Service Section

Author:
Creative Araf

2 months ago

275

v.5.3

Didn't find component you were looking for?

Search from 300+ componenent