Pricing

Style 1

Starter Pack
  • Cras justo odio
  • Dapibus ac facilisis in
  • Morbi leo risus
$49/monthly
<div class="card card-price">
  <div class="card-body">
    <i class="svg-icon w-25 fs-60 text-green">
      <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
        width="64px" height="64px" viewBox="0 0 64 64" enable-background="new 0 0 64 64" xml:space="preserve">
        ...
      </svg>
    </i>
    <h5 class="card-title">Starter Pack</h5>
    <ul class="list-group list-group-minimal text-muted">
      <li class="list-group-item">Cras justo odio</li>
      ...
    </ul>
  </div>
  <a href="" class="card-footer">
    <strong class="card-price">$49</strong>/monthly
  </a>
</div>
Starter Pack
  • Cras justo odio
  • Dapibus ac facilisis in
  • Morbi leo risus
$49/monthly
<div class="card card-price bordered">
  <div class="card-body">
    <i class="svg-icon w-25 fs-60 text-green">
      <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
        width="64px" height="64px" viewBox="0 0 64 64" enable-background="new 0 0 64 64" xml:space="preserve">
        ...
      </svg>
    </i>
    <h5 class="card-title">Starter Pack</h5>
    <ul class="list-group list-group-minimal text-muted">
      <li class="list-group-item">Cras justo odio</li>
      ...
    </ul>
  </div>
  <a href="" class="card-footer">
    <strong class="card-price">$49</strong>/monthly
  </a>
</div>

Style 2

$49

Starter Pack

Lorem ipsum dolor sit amet, consectetur adipisicing elit.


  • Cras justo odio
  • Dapibus ac facilisis in
  • Morbi leo risus
<div class="card card-price-2">
  <div class="card-body">
    <strong class="card-price">$49</strong>
    <h4 class="card-title">Starter Pack</h4>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
    <hr class="ml-0 w-20">
    <ul class="list-group list-group-minimal text-muted">
      <li class="list-group-item"><span>Cras justo odio</span></li>
      ...
    </ul>
  </div>
  <div class="card-footer">
    <a href="#" class="btn btn-lg btn-green btn-block">Purchase</a>
  </div>
</div>
$49

Starter Pack

Lorem ipsum dolor sit amet, consectetur adipisicing elit.


  • Cras justo odio
  • Dapibus ac facilisis in
  • Morbi leo risus
<div class="card card-price-2 bordered">
  <div class="card-body">
    <strong class="card-price">$49</strong>
    <h4 class="card-title">Starter Pack</h4>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
    <hr class="ml-0 w-20">
    <ul class="list-group list-group-minimal text-muted">
      <li class="list-group-item"><span>Cras justo odio</span></li>
      ...
    </ul>
  </div>
  <div class="card-footer">
    <a href="#" class="btn btn-lg btn-green btn-block">Purchase</a>
  </div>
</div>

Style 3

Starter Pack

$49

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dicta earum facere vel voluptates

<div class="card card-price-3">
  <div class="card-body">
    <h4 class="card-title">Starter Pack</h4>
    <strong class="card-price">$49</strong>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dicta earum facere vel voluptates</p>
  </div>
  <div class="card-footer">
    <a href="#" class="btn btn-lg btn-green btn-block"><i class="icon-arrow-right2 fs-20"></i></a>
  </div>
</div>

Starter Pack

$49

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dicta earum facere vel voluptates

<div class="card card-price-3 bordered">
  <div class="card-body">
    <h4 class="card-title">Starter Pack</h4>
    <strong class="card-price">$49</strong>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dicta earum facere vel voluptates</p>
  </div>
  <div class="card-footer">
    <a href="#" class="btn btn-lg btn-green btn-block"><i class="icon-arrow-right2 fs-20"></i></a>
  </div>
</div>