Carousels Bootstrap 5Free+ CSS+ JS
Bootstrap Services in circle slider snippet: a hand-crafted, open-source Bootstrap 5 carousel. HTML, CSS & JS included, ready to copy.
9.3k views527 downloads
gosnippets.com/preview/bootstrap-services-in-circle-slider-snippet
Source Code
1<section class="iq-features">
2 <div class="container">
3 <div class="row align-items-center">
4 <div class="col-lg-3 col-md-12"></div>
5 <div class="col-lg-6 col-md-12">
6 <div class="holderCircle">
7 <div class="round"></div>
8 <div class="dotCircle">
9 <span class="itemDot active itemDot1" data-tab="1">
10 <i class="fa fa-clock-o"></i>
11 <span class="forActive"></span>
12 </span>
13 <span class="itemDot itemDot2" data-tab="2">
14 <i class="fa fa-comments"></i>
15 <span class="forActive"></span>
16 </span>
17 <span class="itemDot itemDot3" data-tab="3">
18 <i class="fa fa-user"></i>
19 <span class="forActive"></span>
20 </span>
21 <span class="itemDot itemDot4" data-tab="4">
22 <i class="fa fa-tags"></i>
23 <span class="forActive"></span>
24 </span>
25 <span class="itemDot itemDot5" data-tab="5">
26 <i class="fa fa-upload"></i>
27 <span class="forActive"></span>
28 </span>
29 <span class="itemDot itemDot6" data-tab="6">
30 <i class="fa fa-briefcase"></i>
31 <span class="forActive"></span>
32 </span>
33 </div>
34 <div class="contentCircle">
35 <div class="CirItem title-box active CirItem1">
36 <h2 class="title"><span>Automate</span></h2>
37 <p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.</p>
38 <i class="fa fa-clock-o"></i>
39 </div>
40 <div class="CirItem title-box CirItem2">
41 <h2 class="title"><span>Chat </span></h2>
42 <p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.</p>
43 <i class="fa fa-comments"></i>
44 </div>
45 <div class="CirItem title-box CirItem3">
46 <h2 class="title"><span>Responses</span></h2>
47 <p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.</p>
48 <i class="fa fa-user"></i>
49 </div>
50 <div class="CirItem title-box CirItem4">
51 <h2 class="title"><span>Tags</span></h2>
52 <p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.</p>
53 <i class="fa fa-tags"></i>
54 </div>
55 <div class="CirItem title-box CirItem5">
56 <h2 class="title"><span>Sharing</span></h2>
57 <p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.</p>
58 <i class="fa fa-upload"></i>
59 </div>
60 <div class="CirItem title-box CirItem6">
61 <h2 class="title"><span>Support</span></h2>
62 <p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.</p>
63 <i class="fa fa-briefcase"></i>
64 </div>
65 </div>
66 </div>
67 </div>
68 <div class="col-lg-3 col-md-12"></div>
69 </div>
70 </div>
71 </section>More Carousels snippets
Bootstrap 5 carousel with multiple cards
Free Bootstrap 5 carousel snippet — Bootstrap 5 carousel with multiple cards. Preview, copy HTML, CSS & JS, drop it into any Bootstrap 5 project.
CarouselsView →
Sliding tabs | CSS transitions only
Sliding tabs | CSS transitions only — a free Bootstrap 5 carousel snippet. Copy the HTML & CSS and paste straight into your Bootstrap 5 project.
CarouselsView →
Bootstrap 5 Snippet Testimonial Slider CSS
Bootstrap 5 Snippet Testimonial Slider CSS — a free Bootstrap 5 carousel snippet. Copy the HTML & CSS and paste straight into your Bootstrap 5 project.
CarouselsView →
Comments(0)
No comments yet — be the first to start the discussion.
Sign in to join the conversation.