Copy any custom block snippet below and paste it on your page to build your website easily.
We offer great prices, premium and quality products for your business.
Enjoy a free 30-day trial and experience the full service. No credit card required!
See All PricesMonthly
Yearly (Save 30%)
<section class="wrapper bg-light">
<div class="container py-14 py-md-16">
<div class="row gy-6">
<div class="col-lg-4">
<h2 class="display-4 mt-lg-18 mb-3">Our Pricing</h2>
<p class="lead fs-lg">We offer <span class="underline">great prices</span>, premium and quality products for your business.</p>
<p>Enjoy a <a href="#" class="hover">free 30-day trial</a> and experience the full service. No credit card required!</p>
<a href="#" class="btn btn-primary rounded-pill mt-2">See All Prices</a>
</div>
<!--/column -->
<div class="col-lg-7 offset-lg-1 pricing-wrapper">
<div class="pricing-switcher-wrapper switcher justify-content-start justify-content-lg-end">
<p class="mb-0 pe-3">Monthly</p>
<div class="pricing-switchers">
<div class="pricing-switcher pricing-switcher-active"></div>
<div class="pricing-switcher"></div>
<div class="switcher-button bg-primary"></div>
</div>
<p class="mb-0 ps-3">Yearly <span class="text-red">(Save 30%)</span></p>
</div>
<div class="row gy-6 position-relative mt-5">
<div class="shape bg-dot primary rellax w-16 h-18" data-rellax-speed="1" style="bottom: -0.5rem; right: -1.6rem;"></div>
<div class="shape rounded-circle bg-line red rellax w-18 h-18" data-rellax-speed="1" style="top: -1rem; left: -2rem;"></div>
<div class="col-md-6">
<div class="pricing card">
<div class="card-body pb-12">
<div class="prices text-dark">
<div class="price price-show"><span class="price-currency">$</span><span class="price-value">19</span> <span class="price-duration">month</span></div>
<div class="price price-hide price-hidden"><span class="price-currency">$</span><span class="price-value">199</span> <span class="price-duration">year</span></div>
</div>
<!--/.prices -->
<h4 class="card-title mt-2">Premium Plan</h4>
<ul class="icon-list bullet-bg bullet-soft-primary mt-8 mb-9">
<li><i class="uil uil-check"></i><span><strong>5</strong> Projects </span></li>
<li><i class="uil uil-check"></i><span><strong>100K</strong> API Access </span></li>
<li><i class="uil uil-check"></i><span><strong>200MB</strong> Storage </span></li>
<li><i class="uil uil-check"></i><span> Weekly <strong>Reports</strong></span></li>
<li><i class="uil uil-times bullet-soft-red"></i><span> 7/24 <strong>Support</strong></span></li>
</ul>
<a href="#" class="btn btn-primary rounded-pill">Choose Plan</a>
</div>
<!--/.card-body -->
</div>
<!--/.pricing -->
</div>
<!--/column -->
<div class="col-md-6 popular">
<div class="pricing card">
<div class="card-body pb-12">
<div class="prices text-dark">
<div class="price price-show"><span class="price-currency">$</span><span class="price-value">49</span> <span class="price-duration">month</span></div>
<div class="price price-hide price-hidden"><span class="price-currency">$</span><span class="price-value">499</span> <span class="price-duration">year</span></div>
</div>
<!--/.prices -->
<h4 class="card-title mt-2">Corporate Plan</h4>
<ul class="icon-list bullet-bg bullet-soft-primary mt-8 mb-9">
<li><i class="uil uil-check"></i><span><strong>20</strong> Projects </span></li>
<li><i class="uil uil-check"></i><span><strong>300K</strong> API Access </span></li>
<li><i class="uil uil-check"></i><span><strong>500MB</strong> Storage </span></li>
<li><i class="uil uil-check"></i><span> Weekly <strong>Reports</strong></span></li>
<li><i class="uil uil-check"></i><span> 7/24 <strong>Support</strong></span></li>
</ul>
<a href="#" class="btn btn-primary rounded-pill">Choose Plan</a>
</div>
<!--/.card-body -->
</div>
<!--/.pricing -->
</div>
<!--/column -->
</div>
<!--/.row -->
</div>
<!--/column -->
</div>
<!--/.row -->
</div>
<!-- /.container -->
</section>
<!-- /section -->
Monthly
Yearly
<section class="wrapper bg-light">
<div class="container py-14 py-md-16">
<div class="row">
<div class="col-lg-10 col-xl-9 col-xxl-8 mx-auto text-center">
<h2 class="fs-15 text-uppercase text-muted mb-3">Our Pricing</h2>
<h3 class="display-4 mb-15 mb-md-6 px-lg-10">We offer great prices, premium products and quality service for your business.</h3>
</div>
<!--/column -->
</div>
<!--/.row -->
<div class="pricing-wrapper position-relative">
<div class="shape bg-dot primary rellax w-16 h-18" data-rellax-speed="1" style="top: 2rem; right: -2.4rem;"></div>
<div class="shape rounded-circle bg-line red rellax w-18 h-18 d-none d-lg-block" data-rellax-speed="1" style="bottom: 0.5rem; left: -2.5rem;"></div>
<div class="pricing-switcher-wrapper switcher">
<p class="mb-0 pe-3">Monthly</p>
<div class="pricing-switchers">
<div class="pricing-switcher pricing-switcher-active"></div>
<div class="pricing-switcher"></div>
<div class="switcher-button bg-primary"></div>
</div>
<p class="mb-0 ps-3">Yearly</p>
</div>
<div class="row gy-6 mt-3 mt-md-5">
<div class="col-md-6 col-lg-4">
<div class="pricing card text-center">
<div class="card-body">
<img src="./img/icons/lineal/shopping-basket.svg" class="svg-inject icon-svg icon-svg-md text-primary mb-3" alt="" />
<h4 class="card-title">Basic Plan</h4>
<div class="prices text-dark">
<div class="price price-show"><span class="price-currency">$</span><span class="price-value">9</span> <span class="price-duration">month</span></div>
<div class="price price-hide price-hidden"><span class="price-currency">$</span><span class="price-value">99</span> <span class="price-duration">year</span></div>
</div>
<!--/.prices -->
<ul class="icon-list bullet-bg bullet-soft-primary mt-8 mb-9 text-start">
<li><i class="uil uil-check"></i><span><strong>1</strong> Project </span></li>
<li><i class="uil uil-check"></i><span><strong>100K</strong> API Access </span></li>
<li><i class="uil uil-check"></i><span><strong>100MB</strong> Storage </span></li>
<li><i class="uil uil-times bullet-soft-red"></i><span> Weekly <strong>Reports</strong> </span></li>
<li><i class="uil uil-times bullet-soft-red"></i><span> 7/24 <strong>Support</strong></span></li>
</ul>
<a href="#" class="btn btn-primary rounded-pill">Choose Plan</a>
</div>
<!--/.card-body -->
</div>
<!--/.pricing -->
</div>
<!--/column -->
<div class="col-md-6 col-lg-4 popular">
<div class="pricing card text-center">
<div class="card-body">
<img src="./img/icons/lineal/home.svg" class="svg-inject icon-svg icon-svg-md text-primary mb-3" alt="" />
<h4 class="card-title">Premium Plan</h4>
<div class="prices text-dark">
<div class="price price-show"><span class="price-currency">$</span><span class="price-value">19</span> <span class="price-duration">month</span></div>
<div class="price price-hide price-hidden"><span class="price-currency">$</span><span class="price-value">199</span> <span class="price-duration">year</span></div>
</div>
<!--/.prices -->
<ul class="icon-list bullet-bg bullet-soft-primary mt-8 mb-9 text-start">
<li><i class="uil uil-check"></i><span><strong>5</strong> Projects </span></li>
<li><i class="uil uil-check"></i><span><strong>100K</strong> API Access </span></li>
<li><i class="uil uil-check"></i><span><strong>200MB</strong> Storage </span></li>
<li><i class="uil uil-check"></i><span> Weekly <strong>Reports</strong></span></li>
<li><i class="uil uil-times bullet-soft-red"></i><span> 7/24 <strong>Support</strong></span></li>
</ul>
<a href="#" class="btn btn-primary rounded-pill">Choose Plan</a>
</div>
<!--/.card-body -->
</div>
<!--/.pricing -->
</div>
<!--/column -->
<div class="col-md-6 offset-md-3 col-lg-4 offset-lg-0">
<div class="pricing card text-center">
<div class="card-body">
<img src="./img/icons/lineal/briefcase-2.svg" class="svg-inject icon-svg icon-svg-md text-primary mb-3" alt="" />
<h4 class="card-title">Corporate Plan</h4>
<div class="prices text-dark">
<div class="price price-show"><span class="price-currency">$</span><span class="price-value">49</span> <span class="price-duration">month</span></div>
<div class="price price-hide price-hidden"><span class="price-currency">$</span><span class="price-value">499</span> <span class="price-duration">year</span></div>
</div>
<!--/.prices -->
<ul class="icon-list bullet-bg bullet-soft-primary mt-8 mb-9 text-start">
<li><i class="uil uil-check"></i><span><strong>20</strong> Projects </span></li>
<li><i class="uil uil-check"></i><span><strong>300K</strong> API Access </span></li>
<li><i class="uil uil-check"></i><span><strong>500MB</strong> Storage </span></li>
<li><i class="uil uil-check"></i><span> Weekly <strong>Reports</strong></span></li>
<li><i class="uil uil-check"></i><span> 7/24 <strong>Support</strong></span></li>
</ul>
<a href="#" class="btn btn-primary rounded-pill">Choose Plan</a>
</div>
<!--/.card-body -->
</div>
<!--/.pricing -->
</div>
<!--/column -->
</div>
<!--/.row -->
</div>
<!--/.pricing-wrapper -->
</div>
<!-- /.container -->
</section>
<!-- /section -->
Monthly
Yearly (Save 30%)
<section class="wrapper bg-light">
<div class="container py-14 py-md-16">
<h2 class="display-5 mb-7 text-center">Our Pricing</h2>
<div class="pricing-wrapper">
<div class="pricing-switcher-wrapper switcher">
<p class="mb-0 pe-3">Monthly</p>
<div class="pricing-switchers">
<div class="pricing-switcher pricing-switcher-active"></div>
<div class="pricing-switcher"></div>
<div class="switcher-button bg-primary"></div>
</div>
<p class="mb-0 ps-3">Yearly <span class="text-red">(Save 30%)</span></p>
</div>
<div class="row gx-0 gy-6 mt-2">
<div class="col-md-6 col-lg-3">
<div class="pricing card shadow-none">
<div class="card-body">
<div class="icon btn btn-circle btn-lg btn-soft-primary disabled"> <i class="uil uil-shopping-bag"></i> </div>
<h4 class="card-title">Basic Plan</h4>
<div class="prices text-dark">
<div class="price price-show"><span class="price-currency">$</span><span class="price-value">9</span> <span class="price-duration">month</span></div>
<div class="price price-hide price-hidden"><span class="price-currency">$</span><span class="price-value">99</span> <span class="price-duration">year</span></div>
</div>
<!--/.prices -->
<ul class="icon-list bullet-bg bullet-soft-primary mt-8 mb-9">
<li><i class="uil uil-check"></i><span><strong>1</strong> Project </span></li>
<li><i class="uil uil-check"></i><span><strong>100K</strong> API Access </span></li>
<li><i class="uil uil-check"></i><span><strong>100MB</strong> Storage </span></li>
<li><i class="uil uil-times bullet-soft-red"></i><span> Weekly <strong>Reports</strong> </span></li>
<li><i class="uil uil-times bullet-soft-red"></i><span> 7/24 <strong>Support</strong></span></li>
</ul>
<a href="#" class="btn btn-soft-primary rounded-pill">Choose Plan</a>
</div>
<!--/.card-body -->
</div>
<!--/.pricing -->
</div>
<!--/column -->
<div class="col-md-6 col-lg-3">
<div class="pricing card shadow-none">
<div class="card-body">
<div class="icon btn btn-circle btn-lg btn-soft-primary disabled"> <i class="uil uil-shopping-cart-alt"></i> </div>
<h4 class="card-title">Premium Plan</h4>
<div class="prices text-dark">
<div class="price price-show"><span class="price-currency">$</span><span class="price-value">19</span> <span class="price-duration">month</span></div>
<div class="price price-hide price-hidden"><span class="price-currency">$</span><span class="price-value">199</span> <span class="price-duration">year</span></div>
</div>
<!--/.prices -->
<ul class="icon-list bullet-bg bullet-soft-primary mt-8 mb-9">
<li><i class="uil uil-check"></i><span><strong>5</strong> Projects </span></li>
<li><i class="uil uil-check"></i><span><strong>100K</strong> API Access </span></li>
<li><i class="uil uil-check"></i><span><strong>200MB</strong> Storage </span></li>
<li><i class="uil uil-check"></i><span> Weekly <strong>Reports</strong></span></li>
<li><i class="uil uil-times bullet-soft-red"></i><span> 7/24 <strong>Support</strong></span></li>
</ul>
<a href="#" class="btn btn-soft-primary rounded-pill">Choose Plan</a>
</div>
<!--/.card-body -->
</div>
<!--/.pricing -->
</div>
<!--/column -->
<div class="col-md-6 col-lg-3">
<div class="pricing card bg-soft-primary">
<div class="card-body">
<div class="icon btn btn-circle btn-lg btn-primary disabled"> <i class="uil uil-store"></i> </div>
<h4 class="card-title">Corporate Plan</h4>
<div class="prices text-dark">
<div class="price price-show"><span class="price-currency">$</span><span class="price-value">29</span> <span class="price-duration">month</span></div>
<div class="price price-hide price-hidden"><span class="price-currency">$</span><span class="price-value">299</span> <span class="price-duration">year</span></div>
</div>
<!--/.prices -->
<ul class="icon-list bullet-bg bullet-primary mt-8 mb-9">
<li><i class="uil uil-check"></i><span><strong>20</strong> Projects </span></li>
<li><i class="uil uil-check"></i><span><strong>300K</strong> API Access </span></li>
<li><i class="uil uil-check"></i><span><strong>500MB</strong> Storage </span></li>
<li><i class="uil uil-check"></i><span> Weekly <strong>Reports</strong></span></li>
<li><i class="uil uil-check"></i><span> 7/24 <strong>Support</strong></span></li>
</ul>
<a href="#" class="btn btn-primary rounded-pill">Choose Plan</a>
</div>
<!--/.card-body -->
</div>
<!--/.pricing -->
</div>
<!--/column -->
<div class="col-md-6 col-lg-3">
<div class="pricing card shadow-none">
<div class="card-body">
<div class="icon btn btn-circle btn-lg btn-soft-primary disabled"> <i class="uil uil-store-alt"></i> </div>
<h4 class="card-title">Community Plan</h4>
<div class="prices text-dark">
<div class="price price-show"><span class="price-currency">$</span><span class="price-value">49</span> <span class="price-duration">month</span></div>
<div class="price price-hide price-hidden"><span class="price-currency">$</span><span class="price-value">499</span> <span class="price-duration">year</span></div>
</div>
<!--/.prices -->
<ul class="icon-list bullet-bg bullet-soft-primary mt-8 mb-9">
<li><i class="uil uil-check"></i><span><strong>90</strong> Projects </span></li>
<li><i class="uil uil-check"></i><span><strong>900K</strong> API Access </span></li>
<li><i class="uil uil-check"></i><span><strong>900MB</strong> Storage </span></li>
<li><i class="uil uil-check"></i><span> Weekly <strong>Reports</strong> </span></li>
<li><i class="uil uil-check"></i><span> 7/24 <strong>Support</strong></span></li>
</ul>
<a href="#" class="btn btn-soft-primary rounded-pill">Choose Plan</a>
</div>
<!--/.card-body -->
</div>
<!--/.pricing -->
</div>
</div>
<!--/.row -->
</div>
<!--/.pricing-wrapper -->
</div>
<!-- /.container -->
</section>
<!-- /section -->
We offer great prices, premium and quality products for your business.
Enjoy a free 30-day trial and experience the full service. No credit card required!
Basic Plan
$9 / Monthly
|
Premium Plan
$19 / Monthly
|
Corporate Plan
$29 / Monthly
|
Business Plan
$49 / Monthly
|
|
---|---|---|---|---|
Project | 1 | 5 | 20 | 90 |
API Access | 100K | 200K | 300K | 900K |
Storage | 100MB | 200MB | 500MB | 900MB |
Weekly Reports | - | |||
24/7 Support | - | - | ||
Choose Plan | Choose Plan | Choose Plan | Choose Plan |
<section class="wrapper bg-light">
<div class="container py-14 py-md-16">
<h2 class="display-4 mb-3">Our Pricing</h2>
<p class="lead fs-lg">We offer <span class="underline">great prices</span>, premium and quality products for your business.</p>
<div class="row">
<div class="col-lg-4">
<p>Enjoy a <a href="#" class="hover">free 30-day trial</a> and experience the full service. No credit card required!</p>
</div>
<!--/column -->
</div>
<!--/.row -->
<a href="#" class="btn btn-primary rounded-pill mt-2">See All Prices</a>
<div class="table-responsive">
<table class="table table-borderless table-striped text-center">
<thead>
<tr>
<th class="w-25"></th>
<th>
<div class="h4 mb-1">Basic Plan</div>
<div class="fs-15 fw-normal text-secondary">$9 / Monthly</div>
</th>
<th>
<div class="h4 mb-1">Premium Plan</div>
<div class="fs-15 fw-normal text-secondary">$19 / Monthly</div>
</th>
<th>
<div class="h4 mb-1">Corporate Plan</div>
<div class="fs-15 fw-normal text-secondary">$29 / Monthly</div>
</th>
<th>
<div class="h4 mb-1">Business Plan</div>
<div class="fs-15 fw-normal text-secondary">$49 / Monthly</div>
</th>
</tr>
</thead>
<tbody>
<tr>
<td class="option text-start">Project</td>
<td>1</td>
<td>5</td>
<td>20</td>
<td>90</td>
</tr>
<tr>
<td class="option text-start">API Access</td>
<td>100K</td>
<td>200K</td>
<td>300K</td>
<td>900K</td>
</tr>
<tr>
<td class="option text-start">Storage</td>
<td>100MB</td>
<td>200MB</td>
<td>500MB</td>
<td>900MB</td>
</tr>
<tr>
<td class="option text-start">Weekly Reports</td>
<td>-</td>
<td><i class="uil uil-check bg-pale-primary text-primary rounded-circle p-1"></i></td>
<td><i class="uil uil-check bg-pale-primary text-primary rounded-circle p-1"></i></td>
<td><i class="uil uil-check bg-pale-primary text-primary rounded-circle p-1"></i></td>
</tr>
<tr>
<td class="option text-start">24/7 Support</td>
<td>-</td>
<td>-</td>
<td><i class="uil uil-check bg-pale-primary text-primary rounded-circle p-1"></i></td>
<td><i class="uil uil-check bg-pale-primary text-primary rounded-circle p-1"></i></td>
</tr>
</tbody>
<tfoot>
<tr>
<th class="w-25"></th>
<th><a href="#" class="btn btn-soft-primary rounded-pill mt-1">Choose Plan</a></th>
<th><a href="#" class="btn btn-soft-primary rounded-pill mt-1">Choose Plan</a></th>
<th><a href="#" class="btn btn-soft-primary rounded-pill mt-1">Choose Plan</a></th>
<th><a href="#" class="btn btn-soft-primary rounded-pill mt-1">Choose Plan</a></th>
</tr>
</tfoot>
</table>
</div>
<!-- /.table-responsive -->
</div>
<!-- /.container -->
</section>
<!-- /section -->
Everything you need to create your next unique and professional website, including impressive and ready-made blocks and pages.
Buy Sandbox