Pricing tables

[one_fourth][accordiongroup][accordion title=”Add-ons”][sidenav][sideitem link=”http://weblusive-themes.com/evolution/styling/alert-boxes/”]Alert Boxes[/sideitem][sideitem link=”http://weblusive-themes.com/evolution/styling/panels/”]Panels[/sideitem][sideitem link=”http://weblusive-themes.com/evolution/styling/pricing-tables/”]Pricing Tables[/sideitem][sideitem link=”http://weblusive-themes.com/evolution/styling/progress-bars/”]Progress Bars[/sideitem][sideitem link=”http://weblusive-themes.com/evolution/styling/tables/”]Tables[/sideitem][sideitem link=”http://weblusive-themes.com/evolution/styling/thumbnails/”]Thumbnails[/sideitem][sideitem link=”http://weblusive-themes.com/evolution/styling/flex-video/”]Flex Video[/sideitem][/sidenav][/accordion][/accordiongroup] [/one_fourth] [three_fourth]

Pricing Tables

If you’re making a rockin’ marketing site for a subscription-based product, you are likely in need of a pricing table. These fill 100% of their container and are made from a simple unordered list.

  • Standard
  • $99.99
  • An awesome description
  • Unlimited
  • 50GB Storage
  • Unlimited
  • Buy now
  • Gold
  • $199.99
  • An awesome description
  • Unlimited
  • 50GB Storage
  • Unlimited
  • Buy now
  • Premium
  • $299.99
  • An awesome description
  • Unlimited
  • 50GB Storage
  • Unlimited
  • Buy now

Building pricing tables with our predefined classes is quite easy. You’ll start with an

and add a class of .pricing-table to it. From there, you just need to add list items inside that represent each piece of the table.

Available HTML class options:
<li class="title">: Creates the styles for a title.
<li class="price">: Add a price that stands out.
<li class="description">: If you need to descript the plan, add this.
<li class="bullet-item">: To call out features, use this list item.
<li class="cta-button">: To add a button inside a list item, use this.

  • Premium
  • $299.99
  • Quisque ornare mauris id orci hendrerit quis porta risus varius. Phasellus sollicitudin nisi a diam auctor cursus.
  • Unlimited
  • 50GB Storage
  • Unlimited
  • Buy Now
[/three_fourth]