Explore our visually vibrant dashboard tile featuring smooth claymorphism and animated KPIs, perfect for modern data visualization.
1<section class="gs-stage">
2 <div class="gs-orb gs-orb-1" aria-hidden="true"></div>
3 <div class="gs-orb gs-orb-2" aria-hidden="true"></div>
4 <div class="gs-grid-overlay" aria-hidden="true"></div>
5 <div class="gs-card">
6 <div class="gs-card-inner">
7 <header class="gs-card-header">
8 <h2>Monthly Performance</h2>
9 <svg width="24" height="24" xmlns="http://www.w3.org/2000/svg">
10 <path d="M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z" fill="currentColor"></path>
11 </svg>
12 </header>
13 <div class="gs-kpi-graph">
14 <div class="gs-sparkline" role="img" aria-label="Performance graph">Graph content here</div>
15 </div>
16 <footer class="gs-card-footer">
17 <div class="gs-details">
18 <div class="gs-detail">
19 <strong>Visitors:</strong> 34,560
20 </div>
21 <div class="gs-detail">
22 <strong>Conversion:</strong> 2.89%
23 </div>
24 </div>
25 <button class="gs-action-btn">
26 Details
27 <svg width="16" height="16" xmlns="http://www.w3.org/2000/svg">
28 <path d="M2 2h12v12H2V2zm4 8h4v-1H6v1zm0-2h4V7H6v1zm0-2h4V5H6v1z" fill="currentColor"></path>
29 </svg>
30 </button>
31 </footer>
32 </div>
33 </div>
34 </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
45
Views
6
Likes
Comments(0)
No comments yet — be the first to start the discussion.
Sign in to join the conversation.