Experience dynamic social engagement with a stunning, molten-copper themed feed card. Our interactive elements and animated share sheet captivate and engage users effortlessly.
1
2<section class="gs-stage">
3 <div class="gs-orb gs-orb-1" aria-hidden="true"></div>
4 <div class="gs-orb gs-orb-2" aria-hidden="true"></div>
5 <div class="gs-card">
6 <div class="gs-card-inner d-flex flex-column justify-content-between">
7 <div class="gs-card-header d-flex align-items-center">
8 <svg class="icon" xmlns="http://www.w3.org/2000/svg" fill="none">
9 <circle></circle>
10 <line></line>
11 <line></line>
12 </svg>
13 <div class="gs-card-user-info">
14 <h5 class="mb-0">Diana Prince</h5>
15 <small>2h ago</small>
16 </div>
17 </div>
18 <div class="gs-card-body">
19 <p class="card-text mb-1">
20 Explore the beauty of animated interfaces with our latest update. Let your creativity flow seamlessly with dynamic interactions!
21 </p>
22 </div>
23 <div class="gs-card-engagement d-flex align-items-center">
24 <button class="btn-like">
25 <svg class="icon" xmlns="http://www.w3.org/2000/svg" fill="none">
26 <path d="M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.68l-1.05-1.06a5.5 5.5 0 0 0-7.78 7.78L12 21.23l9.84-9.84a5.5 5.5 0 0 0 0-7.78z"></path>
27 </svg>
28 <span>98</span>
29 </button>
30 <button class="btn-share">
31 <svg class="icon" xmlns="http://www.w3.org/2000/svg" fill="none">
32 <circle></circle>
33 <circle></circle>
34 <circle></circle>
35 <line></line>
36 <line></line>
37 </svg>
38 Share
39 </button>
40 </div>
41 </div>
42 </div>
43</section>
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.