Bootstrap 5 responsive pricing table with hover effects: a hand-crafted, open-source Bootstrap 5 utility. HTML & CSS included, ready to copy.
1<section class="pricing py-5">
2 <div class="container">
3 <div class="row">
4 <!-- Free Tier -->
5 <div class="col-lg-4">
6 <div class="card mb-5 mb-lg-0">
7 <div class="card-body">
8 <h5 class="card-title text-muted text-uppercase text-center">Free</h5>
9 <h6 class="card-price text-center">$0<span class="period">/month</span></h6>
10 <hr>
11 <ul class="fa-ul">
12 <li><span class="fa-li"><i class="fas fa-check"></i></span>Single User</li>
13 <li><span class="fa-li"><i class="fas fa-check"></i></span>5GB Storage</li>
14 <li><span class="fa-li"><i class="fas fa-check"></i></span>Unlimited Public Projects</li>
15 <li><span class="fa-li"><i class="fas fa-check"></i></span>Community Access</li>
16 <li class="text-muted"><span class="fa-li"><i class="fas fa-times"></i></span>Unlimited Private Projects</li>
17 <li class="text-muted"><span class="fa-li"><i class="fas fa-times"></i></span>Dedicated Phone Support</li>
18 <li class="text-muted"><span class="fa-li"><i class="fas fa-times"></i></span>Free Subdomain</li>
19 <li class="text-muted"><span class="fa-li"><i class="fas fa-times"></i></span>Monthly Status Reports</li>
20 </ul>
21 <a href="#" class="btn w-100 btn-primary text-uppercase">Button</a>
22 </div>
23 </div>
24 </div>
25 <!-- Plus Tier -->
26 <div class="col-lg-4">
27 <div class="card mb-5 mb-lg-0">
28 <div class="card-body">
29 <h5 class="card-title text-muted text-uppercase text-center">Plus</h5>
30 <h6 class="card-price text-center">$9<span class="period">/month</span></h6>
31 <hr>
32 <ul class="fa-ul">
33 <li><span class="fa-li"><i class="fas fa-check"></i></span><strong>5 Users</strong></li>
34 <li><span class="fa-li"><i class="fas fa-check"></i></span>50GB Storage</li>
35 <li><span class="fa-li"><i class="fas fa-check"></i></span>Unlimited Public Projects</li>
36 <li><span class="fa-li"><i class="fas fa-check"></i></span>Community Access</li>
37 <li><span class="fa-li"><i class="fas fa-check"></i></span>Unlimited Private Projects</li>
38 <li><span class="fa-li"><i class="fas fa-check"></i></span>Dedicated Phone Support</li>
39 <li><span class="fa-li"><i class="fas fa-check"></i></span>Free Subdomain</li>
40 <li class="text-muted"><span class="fa-li"><i class="fas fa-times"></i></span>Monthly Status Reports</li>
41 </ul>
42 <a href="#" class="btn w-100 btn-primary text-uppercase">Button</a>
43 </div>
44 </div>
45 </div>
46 <!-- Pro Tier -->
47 <div class="col-lg-4">
48 <div class="card">
49 <div class="card-body">
50 <h5 class="card-title text-muted text-uppercase text-center">Pro</h5>
51 <h6 class="card-price text-center">$49<span class="period">/month</span></h6>
52 <hr>
53 <ul class="fa-ul">
54 <li><span class="fa-li"><i class="fas fa-check"></i></span><strong>Unlimited Users</strong></li>
55 <li><span class="fa-li"><i class="fas fa-check"></i></span>150GB Storage</li>
56 <li><span class="fa-li"><i class="fas fa-check"></i></span>Unlimited Public Projects</li>
57 <li><span class="fa-li"><i class="fas fa-check"></i></span>Community Access</li>
58 <li><span class="fa-li"><i class="fas fa-check"></i></span>Unlimited Private Projects</li>
59 <li><span class="fa-li"><i class="fas fa-check"></i></span>Dedicated Phone Support</li>
60 <li><span class="fa-li"><i class="fas fa-check"></i></span><strong>Unlimited</strong> Free Subdomains</li>
61 <li><span class="fa-li"><i class="fas fa-check"></i></span>Monthly Status Reports</li>
62 </ul>
63 <a href="#" class="btn w-100 btn-primary text-uppercase">Button</a>
64 </div>
65 </div>
66 </div>
67 </div>
68 </div>
69</section>
Auto move mouse cursor snippet
Auto move mouse cursor snippet: a hand-crafted, open-source Bootstrap 5 utility. HTML, CSS & JS included, ready to copy.
Bootstrap 5 Ecommerce Product Detail Page Design snippet
Free Bootstrap 5 utility snippet — Bootstrap 5 Ecommerce Product Detail Page Design snippet. Preview, copy HTML & CSS, drop it into any Bootstrap 5 project.
Bootstrap 5 Ecommerce single product page design template
Free Bootstrap 5 utility snippet — Bootstrap 5 Ecommerce single product page design template. Preview, copy HTML & CSS, drop it into any 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.