15+ Bootstrap Carousel & Slider Examples

Hello there! In this article, you will find 15+ Bootstrap Carousel & Slider designs with complete source code so you can copy and paste it into your project.

Before we get started, let’s take a quick look at what a Bootstrap carousel is. A carousel is a slideshow for cycling through a series of content built using CSS 3D transformations and a bit of JavaScript. Works with a series of images, text, or custom markup. It also includes support for previous/next controls and indicators.

Don’t know how to make a carousel? Don’t worry we’ve got you covered. We have Handpicked the best 15+ Bootstrap Carousel designs from the web for you to use in your project.

Let’s see some cool 15+ Bootstrap Carousel designs.

1. Bootstrap 3 Carousel New Control Positions

Code by	wolfgang1983
Demo & download	click here for code
Language used	HTML, CSS, JS
External link / Dependencies	Yes
Responsive	Yes

Let’s start our list with a very simple and basic Bootstrap carousel by wolfgang1983 made with pure HTML, CSS, and JavaScript.

2. Bootstrap Testimonial Slider Example 1

Code by	nikhil
Demo & download	click here for code
Language used	HTML, CSS
External link / Dependencies	Yes
Responsive	Yes

In this minimal testimonial slider built by Nikhil on the top of the bootstrap carousel, the navigation dots have been changed to the faces of testimonial personalities.

3. Testimonials Carousel

Code by	Gabriel Toledo
Demo & download	click here for code
Language used	HTML,CSS(SCSS),JS
External link / Dependencies	Yes
Responsive	Yes

Another testimonial carousel with a card-based layout is made by Gabriel Toledo using HTML, CSS(SCSS), and JavaScript.

4. Bootstrap Carousel Testimonials

Code by	Rick
Demo & download	click here for code
Language used	HTML, CSS
External link / Dependencies	Yes
Responsive	Yes

Another one! this Bootstrap Testimonial carousel by Rick is using Bootstrap 4 carousel and blockquotes.

5. Full-Width Bootstrap Carousel

Code by	Matt Lambert
Demo & download	click here for code
Language used	HTML
External link / Dependencies	Yes
Responsive	Yes

Full-Width Bootstrap Carousel designed by Matt Lambert using HTML.

Flashcards Using HTML, CSS, &JavaScript

6. Bootstrap Slider Full Screen with Animations

Code by	afmarchetti
Demo & download	click here for code
Language used	HTML, CSS
External link / Dependencies	Yes
Responsive	Yes

Bootstrap Full-Screen carousel with animations by afmarchetti made with pure HTML and CSS.

7. Bootstrap Carousel 100% Fullscreen

Code by	Kathy Szczesny
Demo & download	click here for code
Language used	HTML,CSS(Less)
External link / Dependencies	Yes
Responsive	Yes

Another full-screen Bootstrap carousel is designed and developed by Kathy Szczesny using HTML, and CSS(Less).

8. Bootstrap4 Thumbnail-Carousel

Code by	aholics
Demo & download	click here for code
Language used	HTML,CSS(SCSS),JS
External link / Dependencies	Yes
Responsive	Yes

A Bootstrap carousel by aholics to showcase products on e-commerce websites. This is made using HTML, CSS(SCSS), and JS.

9. Bootstrap 4 – Carousel with contents, outer controls

Code by	David
Demo & download	click here for code
Language used	HTML,CSS(SCSS)
External link / Dependencies	Yes
Responsive	Yes

A Bootstrap carousel with other controls by David made with HTML, and CSS(SCSS).

10. Bootstrap 4 Carousel / Slider with Thumbnail Navigation

Code by	Morten Brunbjerg Bech
Demo & download	click here for code
Language used	HTML, CSS, JS
External link / Dependencies	Yes
Responsive	Yes

A Bootstrap carousel that has thumbnail navigation, developed by Morten Brunbjerg Bech using pure HTML, CSS, and JavaScript.

RGB to hex and hex to RGB Converter using JavaScript

11. Bootstrap 4 Navbar with Slider

Code by	Divinector
Demo & download	click here for code
Language used	HTML, CSS
External link / Dependencies	Yes
Responsive	Yes

A Carousel for homepages, designed by Divinector using HTML and CSS only. Additionally, it also has a drop-down menu.

12. Bootstrap 4 carousel multiple items per slide responsive

Code by	FrankieDoodie
Demo & download	click here for code
Language used	HTML,CSS
External link / Dependencies	Yes
Responsive	Yes

This responsive Bootstrap carousel is made by FrankieDoodie using pure HTML and CSS.

13. Bootstrap Carousel Slider

Code by	Emran Khan
Demo & download	click here for code
Language used	HTML,CSS,JS
External link / Dependencies	Yes
Responsive	Yes

A vertical Bootstrap carousel slider by Emran Khan made with pure HTML, CSS, and JavaScript.

14. Responsive Bootstrap Carousel

Code by	paul braam
Demo & download	click here for code
Language used	HTML, CSS
External link / Dependencies	No
Responsive	Yes

This is a responsive Bootstrap carousel slider by paul braam which you can use for your own website. You can set it up quickly with no coding when desired.

15. Bootstrap Carousel FadeIn & Fadeout

Code by	Wisnu ST
Demo & download	click here for code
Language used	HTML, CSS, JS
External link / Dependencies	No
Responsive	Yes

A bootstrap carousel by Wisnu ST with the effect FadeIn and FadeOut. This is made with HTML, CSS, and JavaScript.

16. Bootstrap Carousel with Ambilight

Code by	adobewordpress
Demo & download	click here for code
Language used	HTML, CSS, JS
External link / Dependencies	Yes
Responsive	Yes

Create Responsive 3D Flip Card Using HTML and CSS

Let’s end this list with a carousel by adobewordpress with an ambient light effect. Pure HTML, CSS, and JavaScript are used here.

That’s it, folks. In this article, we shared 15+ Bootstrap Carousel & Sliders with cool and different designs. We have covered a lot of simple carousels, testimonial carousels, full-screen carousels, and many more.

Hope you liked this article. Share this with your fellow developers. Comment down below your thoughts and suggestions, we would love to hear from you.

See our other articles on codewithrandom and gain knowledge in Front-End Development.

Thank you and keep learning!!

follow us on Instagram: @codewith_random
Written by: @ayushgoel