Pricing Tables

Tables designed to display pricing options in a clear and comparative manner.

Pricing for every budget

Lorem ipsum dolor, sit amet consectetur adipisicing elit.

Bronze

The essential items for your business.

$27/month

5 Widgets

Up to 1,000 subscribers

Basic support

72-hour response time

Get Bronze

Pricing for every budget

Lorem ipsum dolor, sit amet consectetur adipisicing elit.

Bronze

The essential items for your business.

$27/month

5 Widgets

Up to 1,000 subscribers

Basic support

72-hour response time

Get Bronze

Most Popular

Gold

Priority support for your growing business.

$47/month

12 Widgets

Up to 10,000 subscribers

Premium support

48-hour response time

Get Gold

Enterprise

Premium support for your growing business.

$97/month

Unlimited Widgets

Unlimited subscribers

White-glove support

24-hour response time

Get Enterprise

Code Example

<z-container class="center-flex">
  <z-row>
    <z-col class="theme-cta card ">
      <img src="../../docs/images/website/gradient.avif" class="bg-img">
      <z-container>
        <z-row class="pt-5 page-section">
          <z-col class="center">
            <h2>Pricing for every budget</h2>
            <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.</p>
          </z-col>
        </z-row>
        <z-row class="narrow-md pb-5 up-5">
          <z-col class="card  gap-3 border-3 theme-light">
            <p class="text-bold">Bronze</p>
            <p>The essential items for your business.</p>
            <p><span class="h2 bold"><span class="text-superscript">$</span>27</span>/month</p>
            <p><span class="mr-1"><i class="zenicon-check down-1 text-primary-dual"></i> </span> 5 Widgets</p>
            <p><span class="mr-1"><i class="zenicon-check down-1"></i> </span> Up to 1,000 subscribers</p>
            <p><span class="mr-1"><i class="zenicon-check down-1"></i> </span> Basic support</p>
            <p><span class="mr-1"><i class="zenicon-check down-1"></i> </span> 72-hour response time</p>
            <p><a href="" class="btn btn-sm w-125 bg-purple-darkest mt-1">Get Bronze</a></p>
          </z-col>
          <z-col class="card gap-3 theme-light bg-white border-3 shadow-5">
            <span class="label position-top-center bg-purple-darkest  border-1">Most Popular </span>
            <p class="text-bold">Gold </p>
            <p>Priority support for your growing business.</p>
            <p><span class="h2 bold"><span class="text-superscript">$</span>47</span>/month</p>
            <p><span class="mr-1"><i class="zenicon-check down-1"></i> </span> 12 Widgets</p>
            <p><span class="mr-1"><i class="zenicon-check down-1"></i> </span> Up to 10,000 subscribers</p>
            <p><span class="mr-1"><i class="zenicon-check down-1"></i> </span> Premium support</p>
            <p><span class="mr-1"><i class="zenicon-check down-1"></i> </span> 48-hour response time</p>
            <p><a href="" class="btn btn-sm w-125 bg-purple-darkest mt-1">Get Gold</a></p>
          </z-col>
          <z-col class="card gap-3 border-3 theme-light">
            <p class="text-bold d-inline">Enterprise</p>
            <p>Premium support for your growing business.</p>
            <p><span class="h2 bold"><span class="text-superscript">$</span>97</span>/month</p>
            <p><span class="mr-1"><i class="zenicon-check down-1"></i> </span> Unlimited Widgets</p>
            <p><span class="mr-1"><i class="zenicon-check down-1"></i> </span> Unlimited subscribers</p>
            <p><span class="mr-1"><i class="zenicon-check down-1"></i> </span> White-glove support</p>
            <p><span class="mr-1"><i class="zenicon-check down-1"></i> </span> 24-hour response time</p>
            <p><a href="" class="btn btn-sm w-125 bg-purple-darkest mt-1">Get Enterprise</a></p>
          </z-col>
        </z-row>
      </z-container>
    </z-col>
  </z-row>
</z-container>

Bronze

The essential items for your business.

$27/month

5 Widgets

Up to 1,000 subscribers

Basic support

72-hour response time

Get Bronze

Most Popular

Gold

Priority support for your growing business.

$47/month

12 Widgets

Up to 10,000 subscribers

Premium support

48-hour response time

Get Gold

Enterprise

Premium support for your growing business.

$97/month

Unlimited Widgets

Unlimited subscribers

White-glove support

24-hour response time

Get Enterprise

Code Example

<z-container>
  <z-row>
    <z-col class="card align-items-center gap-3 border-3 theme-light">
      <p class="text-bold">Bronze</p>
      <p>The essential items for your business.</p>
      <p><span class="h2 bold"><span class="text-superscript">$</span>27</span>/month</p>
      <p><span class="mr-1"><i class="zenicon-check down-1 text-primary-dual"></i> </span> 5 Widgets</p>
      <p><span class="mr-1"><i class="zenicon-check down-1"></i> </span> Up to 1,000 subscribers</p>
      <p><span class="mr-1"><i class="zenicon-check down-1"></i> </span> Basic support</p>
      <p><span class="mr-1"><i class="zenicon-check down-1"></i> </span> 72-hour response time</p>
      <p><a class="btn btn-sm w-125 btn-cta mt-1">Get Bronze</a></p>
    </z-col>
    <z-col class="card align-items-center gap-3 theme-light border-3 shadow-5">
      <span class="label position-top-center bg-cta ">Most Popular </span>
      <p class="text-bold">Gold </p>
      <p>Priority support for your growing business.</p>
      <p><span class="h2 bold"><span class="text-superscript">$</span>47</span>/month</p>
      <p><span class="mr-1"><i class="zenicon-check down-1"></i> </span> 12 Widgets</p>
      <p><span class="mr-1"><i class="zenicon-check down-1"></i> </span> Up to 10,000 subscribers</p>
      <p><span class="mr-1"><i class="zenicon-check down-1"></i> </span> Premium support</p>
      <p><span class="mr-1"><i class="zenicon-check down-1"></i> </span> 48-hour response time</p>
      <p><a class="btn btn-sm w-125 btn-cta mt-1">Get Gold</a></p>
    </z-col>
    <z-col class="card align-items-center gap-3 border-3 theme-light">
      <p class="text-bold d-inline">Enterprise</p>
      <p>Premium support for your growing business.</p>
      <p><span class="h2 bold"><span class="text-superscript">$</span>97</span>/month</p>
      <p><span class="mr-1"><i class="zenicon-check down-1"></i> </span> Unlimited Widgets</p>
      <p><span class="mr-1"><i class="zenicon-check down-1"></i> </span> Unlimited subscribers</p>
      <p><span class="mr-1"><i class="zenicon-check down-1"></i> </span> White-glove support</p>
      <p><span class="mr-1"><i class="zenicon-check down-1"></i> </span> 24-hour response time</p>
      <p><a class="btn btn-sm w-125 btn-cta mt-1">Get Enterprise</a></p>
    </z-col>
  </z-row>
</z-container>

Bronze

The essential items for your business.

$27/month

5 Widgets

Up to 1,000 subscribers

Basic support

72-hour response time

Get Bronze

Gold Most Popular

Priority support for your growing business.

$47/month

12 Widgets

Up to 10,000 subscribers

Premium support

48-hour response time

Get Gold

Enterprise

Premium support for your growing business.

$97/month

Unlimited Widgets

Unlimited subscribers

White-glove support

24-hour response time

Get Enterprise

Code Example

<z-container>
  <z-row>
    <z-col class="card border-3 align-items-center">
      <p class="bold">Bronze</p>
      <p>The essential items for your business.</p>
      <p><span class="h2 bold"><span class="text-superscript">$</span>27</span>/month</p>
      <p class="ml-1"><span class="mr-1"><i class="zenicon-check-circle"></i></span> 5 Widgets</p>
      <p class="ml-1"><span class="mr-1"><i class="zenicon-check-circle"></i></span> Up to 1,000 subscribers</p>
      <p class="ml-1"><span class="mr-1"><i class="zenicon-check-circle"></i></span> Basic support</p>
      <p class="ml-1"><span class="mr-1"><i class="zenicon-check-circle"></i></span> 72-hour response time</p>
      <p><a href="" class="btn btn-sm w-125 btn-cta mt-1">Get Bronze</a></p>
    </z-col>
    <z-col class="card border-3 align-items-center shadow-2">
      <p class="bold text-cta-dual">Gold <span class="label bg-cta up-2 ml-1">Most Popular</span></p>
      <p>Priority support for your growing business.</p>
      <p><span class="h2 bold"><span class="text-superscript">$</span>47</span>/month</p>
      <p class="ml-1"><span class="mr-1"><i class="zenicon-check-circle"></i></span> 12 Widgets</p>
      <p class="ml-1"><span class="mr-1"><i class="zenicon-check-circle"></i></span> Up to 10,000 subscribers</p>
      <p class="ml-1"><span class="mr-1"><i class="zenicon-check-circle"></i></span> Premium support</p>
      <p class="ml-1"><span class="mr-1"><i class="zenicon-check-circle"></i></span> 48-hour response time</p>
      <p><a href="" class="btn btn-sm w-125 btn-cta mt-1">Get Gold</a></p>
    </z-col>
    <z-col class="card border-3 align-items-center shadow-2">
      <p class="bold">Enterprise</p>
      <p>Premium support for your growing business.</p>
      <p><span class="h2 bold"><span class="text-superscript">$</span>97</span>/month</p>
      <p class="ml-1"><span class="mr-1"><i class="zenicon-check-circle"></i></span> Unlimited Widgets</p>
      <p class="ml-1"><span class="mr-1"><i class="zenicon-check-circle"></i></span> Unlimited subscribers</p>
      <p class="ml-1"><span class="mr-1"><i class="zenicon-check-circle"></i></span> White-glove support</p>
      <p class="ml-1"><span class="mr-1"><i class="zenicon-check-circle"></i></span> 24-hour response time</p>
      <p><a href="" class="btn btn-sm w-125 btn-cta mt-1">Get Enterprise</a></p>
    </z-col>
  </z-row>
</z-container>

The Zen Test

Every component, section, and utility we ship will pass layout, color, and functional tests to ensure they perform flawlessly in today's modern browsers.

So you can be assured it "just works". Try it out below.