Explore a cinematic team profile card featuring an aurora-inspired mesh gradient background, dynamic role badge, and interactive quick-actions.
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 align-items-center text-center">
7 <div class="gs-avatar">
8 <svg xmlns="http://www.w3.org/2000/svg" fill="none">
9 <circle></circle>
10 <path d="M12 14a5 5 0 0 0 5 5H7a5 5 0 0 0 5-5z"></path>
11 <path d="M12 12a3 3 0 1 0 0-6 3 3 0 0 0 0 6z" fill="white"></path>
12 </svg>
13 </div>
14 <h2 class="gs-name">Jane Doe</h2>
15 <span class="gs-role">UI/UX Designer</span>
16 <div class="gs-quick-actions d-flex gap-3 mt-4">
17 <button class="btn gs-btn">
18 <svg xmlns="http://www.w3.org/2000/svg" fill="none">
19 <path d="M12 5v14M5 12h14"></path>
20 </svg>
21 Follow
22 </button>
23 <button class="btn gs-btn">
24 <svg xmlns="http://www.w3.org/2000/svg" fill="none">
25 <path d="M16 12l-4 4-4-4M12 8v8"></path>
26 </svg>
27 Message
28 </button>
29 </div>
30 </div>
31 </div>
32</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.
26
Components
73
Views
6
Likes
Trending now
More Bootstrap snippets developers are viewing this week.
Immerse in a modern audio experience with our neumorphic music player, featuring a dynamic waveform scrubber and interactive queue visuals.
Revolutionize your AI interactions with this stunning, neon-infused chat interface. With dynamic status indicators and orbital animations, it captivates and informs.
Effortlessly manage tasks with our frosted glass-like Kanban board—enhanced by neon glow animations and a drag-to-reorder interface for seamless workflow.
Comments(0)
No comments yet — be the first to start the discussion.
Sign in to join the conversation.