Stack | Multipurpose HTML Template with Variant Page Builder
Sign up with Email

Already have an account?Login


Pricing Options

These modular elements can be readily used and customized across pages and in different blocks.


Explore all of Stack's modular elements
at the Element Index Page →

Basic List

A simple option useful as part of a multi-plan price offering. Use the class .boxed--emphasisin conjunction with a label to emphasise the most valued price option.

<div class="pricing pricing-1 boxed boxed--lg boxed--border">  <h3>Title</h3>      <span class="h2"><strong>$4.99</strong></span>  <span class="type--fine-print">Per Month, AUD Inlc GST.</span>      <hr>      <ul>              <li><span class="checkmark bg--primary-1"></span><span>Perk</span></li>             <li><span class="checkmark bg--primary-1"></span><span>Perk</span></li>             <li><span class="checkmark bg--primary-1"></span><span>Perk</span></li>             <li><span class="checkmark bg--primary-1"></span><span>Perk</span></li>     </ul>     <a class="btn btn--primary" href="#">             <span class="btn__text">                  Button Text             </span>   </a></div><!--end of pricing-->

Basic

$4.99Per Month, AUD Inlc GST.
  • 24/7 Phone Support
  • Unlimited Skips
  • Import CSV Data
  • Automatic Transfer
Purchase Plan

Basic Text

A simple option useful as part of a basic price offering. Use the class .boxed--emphasisin conjunction with a label to emphasise the most valued price option.

<div class="pricing pricing-1 boxed boxed--border boxed--lg boxed--emphasis text-center">      <h4>Title</h4>      <span class="h1"><span class="pricing__dollar">$</span>79</span>    <p>               Description     </p>      <a class="btn btn--primary-1" href="#">               <span class="btn__text">                        Button Text             </span>   </a></div><!--end pricing-->

Regular

$79

The regular license allows you to customize, store and even host your website using your platform

Value Purchase Now

Basic Image

A simple option useful as part of a basic price offering. Use the class .boxed--emphasisin conjunction with a label to emphasise the most valued price option.

<div class="pricing pricing-1 boxed boxed--border boxed--lg boxed--emphasis text-center">   <h4>Title</h4>      <span class="h1"><span class="pricing__dollar">$</span>79</span>    <img alt="Image" src="img/image.png" />   <p>               Description     </p>      <a class="btn btn--primary-1" href="#">               <span class="btn__text">                        Button Text             </span>   </a></div><!--end pricing-->

Designer

$79Image

The regular license allows you to customize, store and even host your website using your platform

Value Purchase Now

Wide List

A wider option suitable as part of a single or double-plan offering. Use a label to emphasise the most valued pricing option.

<div class="pricing pricing-2 boxed boxed--border boxed--lg row">    <div class="col-lg-6 text-center">              <h5>Title</h5>              <span class="h1"><span class="pricing__dollar">$</span>50</span>            <p class="type--fine-print">Per Month, AUD.</p>           <a class="btn btn--primary" href="#">                 <span class="btn__text">Button Text</span>                </a>      </div>    <div class="col-lg-6">          <ul>                      <li><span class="checkmark bg--primary-1"></span><span>Perk</span></li>                   <li><span class="checkmark bg--primary-1"></span><span>Perk</span></li>                   <li><span class="checkmark bg--primary-1"></span><span>Perk</span></li>                   <li><span class="checkmark bg--primary-1"></span><span>Perk</span></li>           </ul>     </div></div><!--end of pricing-->
Value
Medium User
$50

Per Month, AUD.

Purchase Plan
  • 24/7 Phone Support
  • Unlimited Skips
  • Import CSV Data
  • Automatic Transfer
  • 100GB Storage

Minimal List

A minimally styled option ideal for use as part of 3 - 4 part plan offerings. Use a background class such as .bg--primaryon the .pricing__headelement to emphasise the most valued plan.

<div class="pricing pricing-3 text-center">      <div class="pricing__head bg--secondary boxed">         <h5>Title</h5>              <span class="h1"><span class="pricing__dollar">$</span>19</span>            <p class="type--fine-print">Per Month, AUD.</p>   </div>    <ul>              <li><span>Perk</span></li>              <li><span>Perk</span></li>              <li><span>Perk</span></li>              <li><span>Perk</span></li>      </ul></div><!--end pricing-->
Light
$19

Per Month, AUD.

  • Anywhere Access
  • 4GB Online Storage
  • Import User Data
  • Automatic Transfer
  • 24/7 Support

Looking for styled pricing sections?

View Pricing Sections

or try the live builder &nearr;