→ Ad Apon7
→ slider

slider

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

Tags: Hero

Author Ad Apon7

969

v.5.3

Fork Fullscreen

<div id="carouselExampleAutoplaying" class="carousel slide" data-bs-ride="carousel">
        <div class="carousel-inner">
            <div class="carousel-item active">
                <img src="https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fwww.dqsglobal.com%2Fvar%2Fsite%2Fstorage%2Fimages%2F3%2F9%2F4%2F7%2F2567493-1-ger-DE%2F0ecf43ac2388-secure-coding-ism-dqs-shutterstock-1569125488.jpg&f=1&nofb=1&ipt=739ae19d63d949f1c5e62cf93e711c8d74fd7697e4bb6a20ad9cfdc6264ae940" class="d-block w-100" alt="...">
            </div>
            <div class="carousel-item">
                <img src="https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fstatic.vecteezy.com%2Fsystem%2Fresources%2Fpreviews%2F051%2F261%2F577%2Flarge_2x%2Fperson-coding-on-a-laptop-with-vibrant-programming-code-on-the-screen-photo.jpeg&f=1&nofb=1&ipt=1826f7334ab42be0b8de5029e90ae2a9f79bffd05574009013265cd9dd7edf73" class="d-block w-100" alt="...">
            </div>
            <div class="carousel-item">
                <img src="https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fstatic.vecteezy.com%2Fsystem%2Fresources%2Fthumbnails%2F048%2F038%2F959%2Foriginal%2Fisometric-laptop-animation-3d-isometric-laptop-computer-abstract-programming-language-and-program-code-on-a-laptop-screen-transparent-background-with-alpha-channel-free-video.jpg&f=1&nofb=1&ipt=5f0ab2eab16523dad350c7e82ab2adfa7cdb28f604ec4b0caf16ca8ca799a428" class="d-block w-100" alt="...">
            </div>
        </div>
        <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleAutoplaying"
            data-bs-slide="prev">
            <span class="carousel-control-prev-icon" aria-hidden="true"></span>
            <span class="visually-hidden">Previous</span>
        </button>
        <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleAutoplaying"
            data-bs-slide="next">
            <span class="carousel-control-next-icon" aria-hidden="true"></span>
            <span class="visually-hidden">Next</span>
        </button>
    </div>

More Examples

Personal Portfolio --Portfolio Section

Author:
Creative Araf

3 months ago

416

v.5.3
Gradient Hero Section with Pulsing Button

Author:
Ranadhir Debnath

1 year ago

1.8k

v.5.3
Basic hero
Hero section with background image

Author:
Prajwal Hallale

2 years ago

5.3k

v.4.6
Existing Client Section

Author:
istiakahmedchowdhury10

2 months ago

127

v.4.6
Simple hero
Hero section with a linear gradient

Author:
Moana silva

2 years ago

3.8k

v.4.6
Section Title

Author:
istiakahmedchowdhury10

2 months ago

179

v.4.6
About Section

Author:
istiakahmedchowdhury10

2 months ago

127

v.4.6
client feedback

Author:
Huryra

2 months ago

171

v.4.6
portfolio page

Author:
Md. Hasibur Rahman

3 months ago

232

v.4.6
E-Commerce Full

Author:
Zahid Hasan Riyad

2 months ago

739

v.5.3
Home Page

Author:
Md. Hasibur Rahman

3 months ago

257

v.4.6
Elon Musk 2
hero to last home

Author:
RAHAT RAHMAN OFICIAL

5 months ago

607

v.4.6

Didn't find component you were looking for?

Search from 300+ componenent