<section class="position-relative bg-secondary-dark py-24 py-md-40 overflow-hidden">
<div class="container">
<div class="mw-6xl mx-auto mb-32">
<div class="mw-xl">
<span class="h6 text-primary">Our Works</span>
<h2 class="h3 text-white mt-10">More than 20 years in the game</h2>
</div>
</div>
</div>
<div class="d-flex px-4 px-md-0 justify-content-center position-relative">
<img class="d-none d-md-block img-fluid" style="height: 495px; object-fit: cover;" src="https://images.unsplash.com/photo-1618005198919-d3d4b5a92ead?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=967&q=80" alt="">
<div class="flex-shrink-0 w-100 mw-2xl mw-lg-3xl mw-xl-5xl mw-xxl-6xl mx-8 mx-lg-16 mx-xxl-28 position-relative">
<img class="d-block w-100 img-fluid mb-12" style="height: 495px; object-fit: cover;" src="https://images.unsplash.com/photo-1617791160505-6f00504e3519?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1100&q=80" alt="">
<div class="row">
<div class="col-12 col-md-9 col-xl-10 mb-6 mb-md-0">
<div class="position-relative pt-12 pb-16 px-6 px-sm-20 rounded bg-secondary">
<div class="position-absolute top-0 start-0 ms-20 translate-middle bg-secondary" style="width: 64px; height: 64px; clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);"></div>
<h4 class="text-white mb-6">Experience design for your products</h4>
<p class="text-secondary-light mb-0">The brown fox jumps over the lazy dog.</p>
</div>
</div>
<div class="col-12 col-md-3 col-xl-2 text-end">
<button class="btn p-0 me-2 bg-primary d-inline-flex justify-content-center align-items-center text-white rounded-circle" style="width: 62px; height: 62px;">
<svg width="7" height="13" viewbox="0 0 7 13" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6.84708 12.1077C7.05097 12.3133 7.05097 12.6436 6.84708 12.8476C6.64319 13.0517 6.31377 13.0525 6.10988 12.8476L0.152917 6.8708C-0.0509739 6.66673 -0.0509738 6.33645 0.152917 6.13087L6.10988 0.154027C6.31377 -0.0500387 6.64319 -0.0500386 6.84708 0.154027C7.05098 0.358848 7.05098 0.689887 6.84708 0.893952L1.4143 6.50121L6.84708 12.1077Z" fill="white"></path>
</svg>
</button>
<button class="btn p-0 bg-primary d-inline-flex justify-content-center align-items-center text-white rounded-circle" style="width: 62px; height: 62px;">
<svg width="7" height="13" viewbox="0 0 7 13" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M0.152917 0.894235C-0.0509742 0.688658 -0.0509742 0.358375 0.152917 0.15431C0.356808 -0.0497557 0.686228 -0.0505119 0.89012 0.15431L6.84708 6.13116C7.05097 6.33522 7.05097 6.6655 6.84708 6.87108L0.890119 12.8479C0.686227 13.052 0.356807 13.052 0.152916 12.8479C-0.0509753 12.6431 -0.0509753 12.3121 0.152916 12.108L5.5857 6.50074L0.152917 0.894235Z" fill="white"></path>
</svg>
</button>
</div>
</div>
</div>
<img class="d-none d-md-block img-fluid" style="height: 495px; object-fit: cover;" src="https://images.unsplash.com/photo-1618005198919-d3d4b5a92ead?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=967&q=80" alt="">
</div>
</section>Framework
Bootstrap
UI Library
All Libraries
Components
- Alert 85
- Application 58
- Banners 15
- Blog 84
- Call to action 99
- Careers 8
- Contact 42
- Content 62
- Cookies 48
- E-commerce (orders) 14
- E-commerce (products) 24
- FAQ 49
- Features 140
- Footers 58
- Graphs 18
- HTTP codes 55
- Hero section 96
- How it works 46
- Logo clouds 80
- Modals 6
- Navbar 68
- Navigation (horizontal) 97
- Navigation (vertical) 6
- Newsletter 49
- Portfolio 39
- Pricing 47
- Projects 9
- Reviews 5
- Rich text 3
- Sign in / Sign up 81
- Stats 84
- Tables 57
- Team 46
- Testimonials 46
- Users 25
Bootstrap components for portfolio will allow you to display previously completed work, case studies and experience. This is a key element in persuading clients, so make sure to give it the right setting.
On this subpage you can browse a variety of Bootstrap portfolio component themes that are available within our UI libraries. You will also find many other types of components that will be in the same style. Each of these libraries has been prepared by experienced designers along with our in-house team of developers.
Get access to all Bootstrap teams components, code and our editor. Try the demo for free.
