Add a card to your UI with Responsive Info cards with hover effect in CSS. Free Bootstrap 5 code — HTML & CSS ready to copy, MIT licensed.
1<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
2<div class="content">
3 <!-- card -->
4 <div class="card">
5
6 <div class="icon"><i class="material-icons md-36">face</i></div>
7 <p class="title">Profile</p>
8 <p class="text">Click to see or edit your profile page.</p>
9
10 </div>
11 <!-- end card -->
12 <!-- card -->
13 <div class="card">
14
15 <div class="icon"><i class="material-icons md-36">favorite_border</i></div>
16 <p class="title">Favourites</p>
17 <p class="text">Check all your favourites in one place.</p>
18
19 </div>
20 <!-- end card -->
21 <!-- card -->
22 <div class="card">
23
24 <div class="icon"><i class="material-icons md-36">alternate_email</i></div>
25 <p class="title">Contacts</p>
26 <p class="text">Add or change your contacts and links.</p>
27
28 </div>
29 <!-- end card -->
30
31</div>
32</div>
Bootstrap carousel with cards in 3 columns
Bootstrap carousel with cards in 3 columns: a hand-crafted, open-source Bootstrap 5 card. HTML included, ready to copy.
Bootstrap 5 ecommerce product cards details template
Add a card to your UI with Bootstrap 5 ecommerce product cards details template. Free Bootstrap 5 code — HTML & CSS ready to copy, MIT licensed.
Bootstrap snippet Panels with nav tabs using HTML & CSS
Bootstrap snippet Panels with nav tabs using HTML & CSS — a free Bootstrap 5 card snippet. Copy the HTML & CSS and paste straight into your Bootstrap 5 project.
Hand-crafted Tailwind CSS components — HTML or React, copy-paste ready, with live previews. Free forever, MIT licensed, no sign-up to use.
24
Components
57
Views
6
Likes
Trending now
More Bootstrap snippets developers are viewing this week.
Comments(0)
No comments yet — be the first to start the discussion.
Sign in to join the conversation.