The pricing page (and pricing table) is one of the most important pages of any business website that sell something directly online. Depending on the rest of your website, it’s where the user gonna take the final decision to buy or not your product or service.
Most websites that sell a service have usually more than one plan and use a pricing table to list their different plans/prices.
There are many different strategies that can be used when it come to displaying plans and prices. Depending on your business model, you will try to guide your user to make a specific action on your pricing page.
This guide list 22 pricing table from some of the biggest/most popular SaaS on the Internet right now. Keep in mind that those companies have (usually) an extensive team of designers and UX specialists that try to create the highest converting pricing table.
Below each screenshot of pricing table, I wrote a small text describing what the strategy is and some personal comments.
Trello is doing something different from most of the pricing tables you can find in our other examples. Instead of using a list to display all features belonging to a specific plan at the top, it describes the plan with one short sentence. Using a different color for each plan also help to distinguish them.
Zapier uses separated blocks to distinguish their three plans and put their main plan higher than the two others so our eye catches it faster. Also, the main orange color of Zapier is used for the middle block while the free plan uses gray, a duller color that doesn’t attract your vision.
Slack’s pricing table is similar to Trello’s but doesn’t describe the plan with a sentence. You have the name of the plan and the price with a description of how the plans are billed. Under each block of color, you have a call-to-action button with the same color as the box above.
Shopify uses a table layout to display their plans instead of using different blocks. The advantage of using a table is to easily compare all plans with their features.
MailChimp has a pricing page completely different from most other SaaS. With the slider at the top, you can select the number of subscribers that you need and it will highlight which plan is the best for you.
Highrise has a simple pricing table but still efficient. In many cases, simple is better. Their Plus plan which is probably their main one is in a bigger white box in the middle of their two other plans. The call-to-action button is bigger and a different color than the two other plans too. The note “30-day free trial on all accounts” is inside the middle box even if it applies to all plans. It adds more weight to their Plus plan even more.
When you drag the number of contacts slider, the price of each plan changes. At the opposite of many of the examples in this post, ActiveCampaign doesn’t highlight a specific plan for you. The choice is up to you depending on the price and the features you need.
Asana has more simple pricing table than many other SaaS. It has two plans and lists all features under the call-to-action button (click the screenshot to see a full version). Asana adds colors to their paid plan as it will catch your eye easily.
There is a lot going on in this one. A lot of information with small text might make it confusing at the first look for the user. Like many other examples, it highlights a specific plan with a blue border and has the label “New” above it instead of “Most popular” like other SaaS reviewed.
Dropbox uses a table layout that let you easily compare all the features available for each plan. Also, in the header of the table, you have two labels that separate the plans in two categories: For individuals and For teams. These two categories will help the users to filter out faster which plan is the right for them.
In this example, Campaign Monitor chose to use a different strategy. Instead of having a call-to-action button under each plan, there is a big green button above the pricing table that let create your first campaign for free. You will have to select a plan once you signed up and created your campaign.
Buffer uses a standard pricing table to display all their plans and features. It’s easy to read and compare. In the header, two categories are used to separate the plans between Individuals and Teams and Agencies. Also, the call-to-action buttons have a different style to separate the Individuals plans and Teams plans (click on the screenshot to see the full version).
Instead of using a table or blocks, Basecamp uses a text to describe each of their plans. It can be a good strategy as it lets you give more details by explaining each of your plans.
Evernote uses blocks to display their plans. It’s a strategy similar to Zapier (second example from the top). They use the green Evernote color as the main color for their most popular plan. The free plan is gray and their second paid plan use another color. With the border and the ribbon icon, the vision of the user is attracted easily to the Premium plan.
FreshBooks use a simple yet effective layout. All their plans have the same features and the only difference is the number of clients you can bill. Because they don’t have to repeat a set of features for each plan, their plan boxes are small and only display the important information (click on the screenshot to see the full version).
Freshdesk lists all their plans side by side with their features below the price. You can easily see the monthly price and the yearly price by clicking on the switch above the table.
Help Scout highlights their most popular plan by making its box bigger, use their main blue color for the title of the plan and changed the label and style of its call-to-action button.
Instead of having a box bigger than the others, GitHub put all plans at the same level. The icon in each plan is the same color as their call-to-action button.
Their most popular plan has a blue background for the header and a border to attract the eye of the user. If you scroll down (click on the screenshot for a full version), you have more details about the prices and the number of events included.
Instapage highlights their most popular plan with a blue border and list all features available under each plan. The features not available in a specific plan use a lighter color so you can easily see what comes or not with your plan.
HubSpot uses boxes to display their plans and has a header with the label “Most popular option” to guide the user.
Hootsuite has a line of text below the description of the Pro plan saying “Free 30 day trial” to attract the eye of the user. Also, the call-to-action label is different from the two other plans, instead of using the default “Get started”, they use “Start Your 30-Days Free Trial” (click on the screenshot to see a full version.