{"id":1773,"date":"2017-02-13T11:41:50","date_gmt":"2017-02-13T11:41:50","guid":{"rendered":"https:\/\/elementor.com\/blog\/?p=1773"},"modified":"2025-12-06T18:33:53","modified_gmt":"2025-12-06T16:33:53","slug":"how-to-design-price-table","status":"publish","type":"post","link":"https:\/\/elementor.com\/blog\/how-to-design-price-table\/","title":{"rendered":"10 Unique Pricing Table Examples for WordPress, and How We Designed Them"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"1773\" class=\"elementor elementor-1773\" data-elementor-post-type=\"post\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-w2go510 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"w2go510\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-2qcykdf\" data-id=\"2qcykdf\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-h407fvt elementor-widget elementor-widget-text-editor\" data-id=\"h407fvt\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Here in Elementor, our goal is not just to give you the tool, but help you use it. Today I want to focus on a newly added Pro widget, the <a href=\"https:\/\/elementor.com\/widgets\/price-table-widget\/\">Price Table<\/a>, and show you a few examples of best practices for creating beautiful and effective pricing tables.<\/p><p>Our previous tutorial about <a href=\"https:\/\/elementor.com\/blog\/free-elementor-hero-ui-kit\/\">designing\u00a0hero scenes<\/a>\u00a0has gotten great feedback, and my hope is that\u00a0this article will also help you design better pricing tables.<\/p><p>Before we get started, I invite you to check out the full video tutorial by Elementor FED Josh Marom. In the video, Josh explains just how to use\u00a0every aspect of this new widget.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-dfd450e blog-toc elementor-widget elementor-widget-heading\" data-id=\"dfd450e\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Pricing Table Templates<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-24ab980 blog-toc elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list\" data-id=\"24ab980\" data-element_type=\"widget\" data-widget_type=\"icon-list.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<ul class=\"elementor-icon-list-items\">\n\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<a href=\"#Rounded-Corners-Pricing-Table\">\n\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">&nbsp;&nbsp;&nbsp;1. Rounded Corners Pricing Table Template<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<a href=\"#Classic-Pricing-Table\">\n\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">&nbsp;&nbsp;&nbsp;2. Classic Pricing Table <a class=\"wpil_keyword_link\" href=\"https:\/\/elementor.com\/library\/all-categories\/\" title=\"Alle categorie\u00ebn\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"27291\">Template<\/a><\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<a href=\"#Minimal-Pricing-Table\">\n\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">&nbsp;&nbsp;&nbsp;3. Minimal Pricing Table Template<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<a href=\"#Bordered-Price-Table\">\n\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">&nbsp;&nbsp;&nbsp;4. Bordered Price Table Template<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<a href=\"#Icon-Pricing-Table\">\n\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">&nbsp;&nbsp;&nbsp;5. Icon Pricing Table Template<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<a href=\"#Cards-Pricing-Table\">\n\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">&nbsp;&nbsp;&nbsp;6. Cards Pricing Table Template<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<a href=\"#Single-Focus-Pricing-Table\">\n\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">&nbsp;&nbsp;&nbsp;7. Single Focus Pricing Table Template<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<a href=\"#Pop-Out-Pricing-Table\">\n\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">&nbsp;&nbsp;&nbsp;8. Pop-Out Pricing Table Template<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<a href=\"#Add-to-Cart-Pricing-Table\">\n\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">&nbsp;&nbsp;&nbsp;9. Add to Cart Pricing Table Template<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<a href=\"#Extraordinary-Price-Table\">\n\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">10. Extraordinary Price Table Template<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t<\/ul>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-sak2kw4 elementor-widget elementor-widget-text-editor\" data-id=\"sak2kw4\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>If you want to learn how we go about creating unique pricing tables, here are 10 examples of price tables designed in Elementor, including pro tips on how we designed them.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-960f36d elementor-widget elementor-widget-menu-anchor\" data-id=\"960f36d\" data-element_type=\"widget\" data-widget_type=\"menu-anchor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-menu-anchor\" id=\"Rounded-Corners-Pricing-Table\"><\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ugdm3ue elementor-widget elementor-widget-text-editor\" data-id=\"ugdm3ue\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<h3>1.\u00a0The Rounded Corners Pricing Table Template<\/h3><p>We start off with a simple price table, that uses the border radius and box shadows options to create a clean and modern design.<\/p><p>A good rule of thumb is to make sure you never overdo it with regards to features. For this price table, three main features are enough to help the visitors quickly differentiate between the plans and choose the one that suits them\u00a0more.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-j5wv8zp elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list\" data-id=\"j5wv8zp\" data-element_type=\"widget\" data-widget_type=\"icon-list.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<ul class=\"elementor-icon-list-items\">\n\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"e-font-icon-svg e-far-lightbulb\" viewBox=\"0 0 352 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M176 80c-52.94 0-96 43.06-96 96 0 8.84 7.16 16 16 16s16-7.16 16-16c0-35.3 28.72-64 64-64 8.84 0 16-7.16 16-16s-7.16-16-16-16zM96.06 459.17c0 3.15.93 6.22 2.68 8.84l24.51 36.84c2.97 4.46 7.97 7.14 13.32 7.14h78.85c5.36 0 10.36-2.68 13.32-7.14l24.51-36.84c1.74-2.62 2.67-5.7 2.68-8.84l.05-43.18H96.02l.04 43.18zM176 0C73.72 0 0 82.97 0 176c0 44.37 16.45 84.85 43.56 115.78 16.64 18.99 42.74 58.8 52.42 92.16v.06h48v-.12c-.01-4.77-.72-9.51-2.15-14.07-5.59-17.81-22.82-64.77-62.17-109.67-20.54-23.43-31.52-53.15-31.61-84.14-.2-73.64 59.67-128 127.95-128 70.58 0 128 57.42 128 128 0 30.97-11.24 60.85-31.65 84.14-39.11 44.61-56.42 91.47-62.1 109.46a47.507 47.507 0 0 0-2.22 14.3v.1h48v-.05c9.68-33.37 35.78-73.18 52.42-92.16C335.55 260.85 352 220.37 352 176 352 78.8 273.2 0 176 0z\"><\/path><\/svg>\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">Create rounded corners<\/span>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t<\/ul>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7rztul7 elementor-widget elementor-widget-text-editor\" data-id=\"7rztul7\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Price Table &gt; Advanced &gt; Background &amp; Border &gt; Border Radius &gt; 10<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-734iwre elementor-widget elementor-widget-image\" data-id=\"734iwre\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t<figure class=\"wp-caption\">\n\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/elementor\/thumbs\/PriceTable02-r4q76k7s8bzso90qw8mk93psxhsk9tdc4j5mgv01iu.jpg\" title=\"PriceTable02\" alt=\"Price Table 02\" loading=\"lazy\" \/>\t\t\t\t\t\t\t\t\t\t\t<figcaption class=\"widget-image-caption wp-caption-text\">Rounded Corners Pricing Table Template<\/figcaption>\n\t\t\t\t\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7jhykbk elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"7jhykbk\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4f64dc9 elementor-widget elementor-widget-menu-anchor\" data-id=\"4f64dc9\" data-element_type=\"widget\" data-widget_type=\"menu-anchor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-menu-anchor\" id=\"Classic-Pricing-Table\"><\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-8n87iyw elementor-widget elementor-widget-text-editor\" data-id=\"8n87iyw\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<h3><strong>2. The Classic Pricing Table\u00a0<\/strong>Template<\/h3><p>This classic design shows all the elements\u00a0to create a nice design. It includes an interesting use of background colors for the title and price sections. In addition, features are highlighted by check and times icons to highlight which features appear on each plan. We also give a more generous top and bottom\u00a0padding to the pricing section, giving it more focus than the features that are more close together.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-9o36rmy elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list\" data-id=\"9o36rmy\" data-element_type=\"widget\" data-widget_type=\"icon-list.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<ul class=\"elementor-icon-list-items\">\n\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"e-font-icon-svg e-far-lightbulb\" viewBox=\"0 0 352 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M176 80c-52.94 0-96 43.06-96 96 0 8.84 7.16 16 16 16s16-7.16 16-16c0-35.3 28.72-64 64-64 8.84 0 16-7.16 16-16s-7.16-16-16-16zM96.06 459.17c0 3.15.93 6.22 2.68 8.84l24.51 36.84c2.97 4.46 7.97 7.14 13.32 7.14h78.85c5.36 0 10.36-2.68 13.32-7.14l24.51-36.84c1.74-2.62 2.67-5.7 2.68-8.84l.05-43.18H96.02l.04 43.18zM176 0C73.72 0 0 82.97 0 176c0 44.37 16.45 84.85 43.56 115.78 16.64 18.99 42.74 58.8 52.42 92.16v.06h48v-.12c-.01-4.77-.72-9.51-2.15-14.07-5.59-17.81-22.82-64.77-62.17-109.67-20.54-23.43-31.52-53.15-31.61-84.14-.2-73.64 59.67-128 127.95-128 70.58 0 128 57.42 128 128 0 30.97-11.24 60.85-31.65 84.14-39.11 44.61-56.42 91.47-62.1 109.46a47.507 47.507 0 0 0-2.22 14.3v.1h48v-.05c9.68-33.37 35.78-73.18 52.42-92.16C335.55 260.85 352 220.37 352 176 352 78.8 273.2 0 176 0z\"><\/path><\/svg>\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">Set interesting background colors<\/span>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t<\/ul>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1ohctfl elementor-widget elementor-widget-text-editor\" data-id=\"1ohctfl\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Price Table &gt; Style &gt; Header &gt; Background Color<\/p><p>PT &gt; Style &gt; Pricing &gt; Background Color<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-lbh0lje elementor-widget elementor-widget-image\" data-id=\"lbh0lje\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t<figure class=\"wp-caption\">\n\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/elementor\/thumbs\/PriceTable01-r4q73rn1x2645z2u7j5hcb3hd9kae7a22pco49560m.jpg\" title=\"PriceTable01\" alt=\"Price Table 01\" loading=\"lazy\" \/>\t\t\t\t\t\t\t\t\t\t\t<figcaption class=\"widget-image-caption wp-caption-text\">Classic Pricing Table Template<\/figcaption>\n\t\t\t\t\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1b9boky elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"1b9boky\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-035e25f elementor-widget elementor-widget-menu-anchor\" data-id=\"035e25f\" data-element_type=\"widget\" data-widget_type=\"menu-anchor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-menu-anchor\" id=\"Minimal-Pricing-Table\"><\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-mb322zr elementor-widget elementor-widget-text-editor\" data-id=\"mb322zr\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<h3><strong>3. The Minimal Pricing Table\u00a0<\/strong>Template<\/h3><p>This design is effective because it sends a clear, hassle free message to the potential client. What you see is what you get.<\/p><p>This\u00a0straightforward approach cuts down on any visitor hesitation and makes it easy to decide to go onboard. Whereas it is usually advised to downplay the free plan in favor of the paid one,\u00a0this is the exception to that rule.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-znybmjv elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list\" data-id=\"znybmjv\" data-element_type=\"widget\" data-widget_type=\"icon-list.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<ul class=\"elementor-icon-list-items\">\n\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<i class=\"fa fa-lightbulb-o\" aria-hidden=\"true\"><\/i>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">Thick top border color<\/span>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t<\/ul>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-kj94hc5 elementor-widget elementor-widget-text-editor\" data-id=\"kj94hc5\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>\u00a0Price Table &gt; Border &gt; Top &gt; 5px<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0dpwn40 elementor-widget elementor-widget-image\" data-id=\"0dpwn40\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t<figure class=\"wp-caption\">\n\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/elementor\/thumbs\/PriceTable10-r4q6yfvz6uvmditdb89l7nhg6ntery4tcc9m7t1h9y.jpg\" title=\"PriceTable10\" alt=\"Price Table 10\" loading=\"lazy\" \/>\t\t\t\t\t\t\t\t\t\t\t<figcaption class=\"widget-image-caption wp-caption-text\">Minimal Pricing Table Template<\/figcaption>\n\t\t\t\t\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-i1sczm7 elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"i1sczm7\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-01d30df elementor-widget elementor-widget-menu-anchor\" data-id=\"01d30df\" data-element_type=\"widget\" data-widget_type=\"menu-anchor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-menu-anchor\" id=\"Bordered-Price-Table\"><\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-fcfu0ps elementor-widget elementor-widget-text-editor\" data-id=\"fcfu0ps\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<h3><strong>4. The Bordered Price Table\u00a0<\/strong>Template<\/h3><p>This PT\u00a0uses one main color: red. By setting a different\u00a0and thicker top border, we get a nicer effect\u00a0for the whole table. The third plan is\u00a0elongated and includes a green &#8216;hot&#8217; ribbon. This sets it apart and focuses the attention on it. Because of the heavy use of the red color, the green ribbon really makes the third plan pop-out nicely.<\/p><p>To get the border effect, All boxes get a top solid red color of 8, and the left and right borders are different for each box. This prevents the borders between the price tables to be double in size.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-jxdctvu elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list\" data-id=\"jxdctvu\" data-element_type=\"widget\" data-widget_type=\"icon-list.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<ul class=\"elementor-icon-list-items\">\n\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<i class=\"fa fa-lightbulb-o\" aria-hidden=\"true\"><\/i>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">Pricing plans that are attached to one another<\/span>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t<\/ul>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0qbk1jf elementor-widget elementor-widget-text-editor\" data-id=\"0qbk1jf\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Price Table #1: Advanced &gt; Background &amp; Border &gt; Width &gt; 8, 1, 1, 1 <br \/>PT #2: Advanced &gt; Background &amp; Border &gt; Width &gt; 8, 0, 1, 0 <br \/>PT\u00a0#3: Advanced &gt; Background &amp; Border &gt; Width &gt; 8, 1, 1, 1 <br \/>PT\u00a0#4: Advanced &gt; Background &amp; Border &gt; Width &gt; 8, 1, 1, 0<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-8jze4pw elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list\" data-id=\"8jze4pw\" data-element_type=\"widget\" data-widget_type=\"icon-list.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<ul class=\"elementor-icon-list-items\">\n\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<i class=\"fa fa-lightbulb-o\" aria-hidden=\"true\"><\/i>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">Third box is heigher than the rest<\/span>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t<\/ul>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-wsuggq2 elementor-widget elementor-widget-text-editor\" data-id=\"wsuggq2\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Section &gt; Layout &gt;\u00a0Content Position &gt; Bottom<\/p><p>Price Table #3: Style &gt; Header &gt; Padding top &amp; bottom &gt; 20px<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-289d9p5 elementor-widget elementor-widget-image\" data-id=\"289d9p5\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t<figure class=\"wp-caption\">\n\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/elementor\/thumbs\/PriceTable08-r4q715n6xmlfwyvdgeiseytdyqfl0gwwds444l0jau.jpg\" title=\"PriceTable08\" alt=\"Price Table 08\" loading=\"lazy\" \/>\t\t\t\t\t\t\t\t\t\t\t<figcaption class=\"widget-image-caption wp-caption-text\">Bordered Price Table Template<\/figcaption>\n\t\t\t\t\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-t8s03ra elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"t8s03ra\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-fee450c elementor-widget elementor-widget-menu-anchor\" data-id=\"fee450c\" data-element_type=\"widget\" data-widget_type=\"menu-anchor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-menu-anchor\" id=\"Icon-Pricing-Table\"><\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-btf05w3 elementor-widget elementor-widget-text-editor\" data-id=\"btf05w3\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<h3><strong>5. The Icon Pricing Table\u00a0<\/strong>Template<\/h3><p>What is nice about Elementor widgets is that they work great combined. In this example, we combine the icon widget on top of the price table, so the Drupal, WordPress and Joomla icons appear on top.\u00a0<\/p><p>You can emphasize the most preferred plan in any number of creative ways. In this example, a simple solid black border on the column level and negative button background color are all it takes to do the trick.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-dxq90ie elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list\" data-id=\"dxq90ie\" data-element_type=\"widget\" data-widget_type=\"icon-list.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<ul class=\"elementor-icon-list-items\">\n\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<i class=\"fa fa-lightbulb-o\" aria-hidden=\"true\"><\/i>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">Combine the Icon and Price Table widgets<\/span>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t<\/ul>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-o5l1r2t elementor-widget elementor-widget-text-editor\" data-id=\"o5l1r2t\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Price Table &gt; Advanced &gt; Element Style &gt; Margin top\u00a0&gt; &#8216;-20&#8217; (To get rid of the default widget padding)<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5v3jxwi elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list\" data-id=\"5v3jxwi\" data-element_type=\"widget\" data-widget_type=\"icon-list.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<ul class=\"elementor-icon-list-items\">\n\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<i class=\"fa fa-lightbulb-o\" aria-hidden=\"true\"><\/i>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">Add a black frame around the middle pricing table<\/span>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t<\/ul>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-dsi0wry elementor-widget elementor-widget-text-editor\" data-id=\"dsi0wry\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Price Table #2 &gt;Column &gt; Background &amp; Border &gt; Width &gt; 3<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0dbkklh elementor-widget elementor-widget-image\" data-id=\"0dbkklh\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t<figure class=\"wp-caption\">\n\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/elementor\/thumbs\/PriceTable06-r4q70z2blscfnp4xitoefih5t1c0il6s0vjprnaaie.jpg\" title=\"PriceTable06\" alt=\"Price Table 06\" loading=\"lazy\" \/>\t\t\t\t\t\t\t\t\t\t\t<figcaption class=\"widget-image-caption wp-caption-text\">Icon Pricing Table Template<\/figcaption>\n\t\t\t\t\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-zj6fdcr elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"zj6fdcr\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-04f0447 elementor-widget elementor-widget-menu-anchor\" data-id=\"04f0447\" data-element_type=\"widget\" data-widget_type=\"menu-anchor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-menu-anchor\" id=\"Cards-Pricing-Table\"><\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-faiyml5 elementor-widget elementor-widget-text-editor\" data-id=\"faiyml5\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<h3><strong>6. The Cards Pricing Table\u00a0<\/strong>Template<\/h3><p>This unique card effect creates a really unique effect for the price table, making it much more visual and playful than before.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-bbb22ku elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list\" data-id=\"bbb22ku\" data-element_type=\"widget\" data-widget_type=\"icon-list.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<ul class=\"elementor-icon-list-items\">\n\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<i class=\"fa fa-lightbulb-o\" aria-hidden=\"true\"><\/i>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">Set background image &amp; opacity<\/span>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t<\/ul>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-8u8126t elementor-widget elementor-widget-text-editor\" data-id=\"8u8126t\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Price Table &gt; Advanced &gt; Background &amp; Border &gt; Image<\/p><p>PT\u00a0&gt; Style &gt; Header, Pricing, Features, Footer &gt; Background Color &gt; Grey, Opacity 50%<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-73b3j0c elementor-widget elementor-widget-image\" data-id=\"73b3j0c\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t<figure class=\"wp-caption\">\n\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/elementor\/thumbs\/PriceTable09-r4q70edvffk4k9yyvkqlwnp0qk5xt8wom1717k4yba.jpg\" title=\"PriceTable09\" alt=\"Price Table\" loading=\"lazy\" \/>\t\t\t\t\t\t\t\t\t\t\t<figcaption class=\"widget-image-caption wp-caption-text\">Cards Pricing Table Template<\/figcaption>\n\t\t\t\t\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-rr86llx elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"rr86llx\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-9b58324 elementor-widget elementor-widget-menu-anchor\" data-id=\"9b58324\" data-element_type=\"widget\" data-widget_type=\"menu-anchor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-menu-anchor\" id=\"Single-Focus-Pricing-Table\"><\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-vh76b1g elementor-widget elementor-widget-text-editor\" data-id=\"vh76b1g\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<h3><strong>7. The Single Focus\u00a0Pricing Table\u00a0<\/strong>Template<\/h3><p>This pricing table features three &#8216;plain&#8217; white plans, that are all overshadowed by the main crimson colored plan that is also bigger, features negative colors and is framed. The result is an interesting layout which should also convert nicely\u00a0since the eye is automatically drawn to the Business plan.\u00a0<\/p><p>Here, we used a box shadow with no blur on the column to create the external red frame effect around the price table. We also had to add some custom <a class=\"wpil_keyword_link\" href=\"https:\/\/elementor.com\/blog\/what-is-css\/\"   title=\"What Is CSS? How to Use it in Web Design (2025)\" data-wpil-keyword-link=\"linked\"  data-wpil-monitor-id=\"27292\">CSS<\/a> to bring the box shadow frame in front of the other price tables.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-hhkwdax elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list\" data-id=\"hhkwdax\" data-element_type=\"widget\" data-widget_type=\"icon-list.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<ul class=\"elementor-icon-list-items\">\n\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<i class=\"fa fa-lightbulb-o\" aria-hidden=\"true\"><\/i>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">Set white and red frame effect<\/span>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t<\/ul>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-czi26ta elementor-widget elementor-widget-text-editor\" data-id=\"czi26ta\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Column &gt; Style &gt; Background &amp; Border &gt; Color &gt;\u00a0<code>#ffffff<\/code><\/p><p>Column &gt; Style &gt; Box Shadow &gt; Yes, Blur &gt; 0<\/p><p>Column &gt; Advanced &gt; Custom CSS: <code>selector {z-index:2;}<\/code><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-z0dci7e elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list\" data-id=\"z0dci7e\" data-element_type=\"widget\" data-widget_type=\"icon-list.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<ul class=\"elementor-icon-list-items\">\n\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<i class=\"fa fa-lightbulb-o\" aria-hidden=\"true\"><\/i>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">Get the third price table to stick out on both sides<\/span>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t<\/ul>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-x15cryb elementor-widget elementor-widget-text-editor\" data-id=\"x15cryb\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Section &gt; Layout &gt;\u00a0Content Position &gt;\u00a0Middle<\/p><p>Price Table #3: Style &gt; Header &gt; Padding top &gt; 10px<\/p><p>PT\u00a0#3: Style &gt; Footer &gt; Padding bottom &gt; 10px<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-o8mqx65 elementor-widget elementor-widget-image\" data-id=\"o8mqx65\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t<figure class=\"wp-caption\">\n\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/elementor\/thumbs\/PriceTable04-r4q6ytzk1dex7o8w0wczr1xd3fvwzeosea1weygkom.jpg\" title=\"PriceTable04\" alt=\"Price Table 04\" loading=\"lazy\" \/>\t\t\t\t\t\t\t\t\t\t\t<figcaption class=\"widget-image-caption wp-caption-text\">Single Focus Pricing Table Template<\/figcaption>\n\t\t\t\t\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6bi834w elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"6bi834w\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a1e30ee elementor-widget elementor-widget-menu-anchor\" data-id=\"a1e30ee\" data-element_type=\"widget\" data-widget_type=\"menu-anchor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-menu-anchor\" id=\"Pop-Out-Pricing-Table\"><\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ofhn1xx elementor-widget elementor-widget-text-editor\" data-id=\"ofhn1xx\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<h3>8. The Pop-Out\u00a0<strong>Pricing Table\u00a0<\/strong>Template<\/h3><p>Even without reading the features one can come to the conclusion that this is a hotel resort price table. The\u00a0smart use of a script font, icons, gold and dark-blue colors, drop shadows and background image, all help to give it the luxurious design we automatically assign to premium hotels.<\/p><p>To put more emphasis on the middle plan, we&#8217;ve made\u00a0it wider, We also created a pop-out effect by playing with the border radius and box shadows.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-n8pztdo elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list\" data-id=\"n8pztdo\" data-element_type=\"widget\" data-widget_type=\"icon-list.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<ul class=\"elementor-icon-list-items\">\n\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<i class=\"fa fa-lightbulb-o\" aria-hidden=\"true\"><\/i>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">Get the round edges<\/span>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t<\/ul>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-tmk18hb elementor-widget elementor-widget-text-editor\" data-id=\"tmk18hb\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Price Table #1: Advanced &gt; Background &amp; Border &gt; Border Radius &gt; 10, 0, 0, 10<\/p><p>PT\u00a0#2: Advanced &gt; Background &amp; Border &gt; Border Radius &gt; 10, 10, 10, 10<\/p><p>PT\u00a0#3: Advanced &gt; Background &amp; Border &gt; Border Radius &gt; 0, 10, 10, 0<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-exa647d elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list\" data-id=\"exa647d\" data-element_type=\"widget\" data-widget_type=\"icon-list.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<ul class=\"elementor-icon-list-items\">\n\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<i class=\"fa fa-lightbulb-o\" aria-hidden=\"true\"><\/i>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">Make the middle price table wider<\/span>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t<\/ul>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-x6s6dna elementor-widget elementor-widget-text-editor\" data-id=\"x6s6dna\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Price Table #1, #3: Column Width &gt; 31%<\/p><p>PT\u00a0#2: Column Width &gt; 37.6%<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0gy5tmp elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list\" data-id=\"0gy5tmp\" data-element_type=\"widget\" data-widget_type=\"icon-list.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<ul class=\"elementor-icon-list-items\">\n\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<i class=\"fa fa-lightbulb-o\" aria-hidden=\"true\"><\/i>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">Pop out the middle column in front of the others<\/span>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t<\/ul>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-kkztxl6 elementor-widget elementor-widget-text-editor\" data-id=\"kkztxl6\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Middle Column &gt; Advanced &gt; Custom CSS: <code>selector {z-index:2;}<\/code><\/p><p>Middle Section &gt; Layout &gt;\u00a0Content Position &gt;\u00a0Middle<\/p><p>Price Table #3: Style &gt; Header &gt; Padding top &gt; 10px<\/p><p>PT\u00a0#3: Style &gt; Footer &gt; Padding bottom &gt; 10px<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5wcnr9b elementor-widget elementor-widget-image\" data-id=\"5wcnr9b\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t<figure class=\"wp-caption\">\n\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/elementor\/thumbs\/PriceTable07-r4q74rcx4rj0f5myeylaz22zxwo8ip7uvm54cro7g6.jpg\" title=\"PriceTable07\" alt=\"Price Table 07\" loading=\"lazy\" \/>\t\t\t\t\t\t\t\t\t\t\t<figcaption class=\"widget-image-caption wp-caption-text\">Pop-Out Pricing Table Template<\/figcaption>\n\t\t\t\t\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-m9dkt0y elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"m9dkt0y\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1b335f4 elementor-widget elementor-widget-menu-anchor\" data-id=\"1b335f4\" data-element_type=\"widget\" data-widget_type=\"menu-anchor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-menu-anchor\" id=\"Add-to-Cart-Pricing-Table\"><\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-l04d6uj elementor-widget elementor-widget-text-editor\" data-id=\"l04d6uj\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<h3><strong>9. The &#8216;Add to Cart&#8217; Pricing Table\u00a0<\/strong>Template<\/h3><p>This is another example of matching another widget\u00a0to the price table, this time an image widget. By using the Woo-Add to Cart widget, you can create landing pages that compare various products, and\u00a0allows the visitor to add them to the <a href=\"https:\/\/woocommerce.com\/\" target=\"_blank\" rel=\"noopener noreferrer\">WooCommerce<\/a> cart with a click.\u00a0You can also replicate this example to create not only pricing plans but top 5 product comparison pages that look amazing.\u00a0<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-9qepew4 elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list\" data-id=\"9qepew4\" data-element_type=\"widget\" data-widget_type=\"icon-list.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<ul class=\"elementor-icon-list-items\">\n\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<i class=\"fa fa-lightbulb-o\" aria-hidden=\"true\"><\/i>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">Attach image<\/span>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t<\/ul>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-tn9t5sw elementor-widget elementor-widget-text-editor\" data-id=\"tn9t5sw\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Image &gt; Advanced &gt; Element Style &gt; Margin &gt; -20<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-mxp0uum elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list\" data-id=\"mxp0uum\" data-element_type=\"widget\" data-widget_type=\"icon-list.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<ul class=\"elementor-icon-list-items\">\n\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<i class=\"fa fa-lightbulb-o\" aria-hidden=\"true\"><\/i>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">Add the Add to Cart button<\/span>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t<\/ul>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-gkxjfhw elementor-widget elementor-widget-text-editor\" data-id=\"gkxjfhw\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Drag &amp; drop &#8216;Woo Add to cart&#8217; widget<\/p><p>Pair\u00a0each button to the right product<\/p><p>\u00a0<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-9wg9slw elementor-widget elementor-widget-image\" data-id=\"9wg9slw\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t<figure class=\"wp-caption\">\n\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/elementor\/thumbs\/PriceTable05-r4q6ys3vnpcckgbmbvjqm2efwo56k0hbq0qxgejd12.jpg\" title=\"PriceTable05\" alt=\"Price Table 05\" loading=\"lazy\" \/>\t\t\t\t\t\t\t\t\t\t\t<figcaption class=\"widget-image-caption wp-caption-text\">'Add to Cart' Pricing Table Template<\/figcaption>\n\t\t\t\t\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0tts1bv elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"0tts1bv\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-cef9520 elementor-widget elementor-widget-menu-anchor\" data-id=\"cef9520\" data-element_type=\"widget\" data-widget_type=\"menu-anchor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-menu-anchor\" id=\"Extraordinary-Price-Table\"><\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-nfc15dd elementor-widget elementor-widget-text-editor\" data-id=\"nfc15dd\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<h3>10. \u00a0The Extraordinary Price Table Template<\/h3><p><b> <\/b>Honestly, price tables can be so boring. They are still tables, what could\u00a0be more boring than tables? I&#8217;ve seen many price tables that looked like they were pasted from Excel. Yikes!<\/p><p>In the example above we manage to bring our pricing table to life by using\u00a0vivid colors, a white frame, semi-transparent backgrounds and box shadows. This way we manage to create a unique and much more interesting design.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-xypu5eb elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list\" data-id=\"xypu5eb\" data-element_type=\"widget\" data-widget_type=\"icon-list.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<ul class=\"elementor-icon-list-items\">\n\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<i class=\"fa fa-lightbulb-o\" aria-hidden=\"true\"><\/i>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">Create a semi-transparent price table<\/span>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t<\/ul>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7iazv6n elementor-widget elementor-widget-text-editor\" data-id=\"7iazv6n\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Price Table &gt; Advanced &gt; Background &amp; Border &gt; Color &gt; Opacity 50%<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-nvapo55 elementor-widget elementor-widget-image\" data-id=\"nvapo55\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t<figure class=\"wp-caption\">\n\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/elementor\/thumbs\/PriceTable03-r4q73l26l7x3wpce9yb3cur97kgpwbjxpss9rbex86.jpg\" title=\"PriceTable03\" alt=\"Price Table 03\" loading=\"lazy\" \/>\t\t\t\t\t\t\t\t\t\t\t<figcaption class=\"widget-image-caption wp-caption-text\">Extraordinary Price Table Template<\/figcaption>\n\t\t\t\t\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-15rpf13 elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"15rpf13\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-s1sdem9 elementor-widget elementor-widget-text-editor\" data-id=\"s1sdem9\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<h3>Conclusion<\/h3><p>I hope you&#8217;ve enjoyed this\u00a0short tutorial. Feel free to share your own\u00a0best practices when designing price tables in the comments section below.<\/p><p>If you&#8217;d like to enjoy this widget, plus\u00a0many more useful widgets and features, check out <a href=\"https:\/\/elementor.com\/pro\">Elementor Pro<\/a>. We&#8217;ve added some new Pro templates that include price table designs, to help you get started.<\/p><p>\u00a0<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Today we are\u00a0sharing our most valuable best practices for designing beautiful &amp; highly converting pricing table designs with Elementor.<\/p>\n","protected":false},"author":4,"featured_media":1778,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[17,32],"tags":[79,173],"marketing_persona":[],"marketing_intent":[],"class_list":["post-1773","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-inspiration","category-design","tag-build","tag-video"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.7 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>10 Unique Pricing Table Examples for WordPress Using Elementor<\/title>\n<meta name=\"description\" content=\"Today, we are sharing some of our beautiful &amp; highly converting WordPress pricing table examples, all made with Elementor Page Builder.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/elementor.com\/blog\/how-to-design-price-table\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"10 Unique Pricing Table Examples for WordPress Using Elementor\" \/>\n<meta property=\"og:description\" content=\"Today, we are sharing some of our beautiful &amp; highly converting WordPress pricing table examples, all made with Elementor Page Builder.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/elementor.com\/blog\/how-to-design-price-table\/\" \/>\n<meta property=\"og:site_name\" content=\"Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/elemntor\/\" \/>\n<meta property=\"article:published_time\" content=\"2017-02-13T11:41:50+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-12-06T16:33:53+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2017\/01\/PriceTable04.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1024\" \/>\n\t<meta property=\"og:image:height\" content=\"682\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Ben Pines\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@elemntor\" \/>\n<meta name=\"twitter:site\" content=\"@elemntor\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Ben Pines\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"8 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/elementor.com\/blog\/how-to-design-price-table\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/elementor.com\/blog\/how-to-design-price-table\/\"},\"author\":{\"name\":\"Ben Pines\",\"@id\":\"https:\/\/elementor.com\/blog\/#\/schema\/person\/c772e5251f765dce36a2b4989bad900a\"},\"headline\":\"10 Unique Pricing Table Examples for WordPress, and How We Designed Them\",\"datePublished\":\"2017-02-13T11:41:50+00:00\",\"dateModified\":\"2025-12-06T16:33:53+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/elementor.com\/blog\/how-to-design-price-table\/\"},\"wordCount\":1558,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/elementor.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/elementor.com\/blog\/how-to-design-price-table\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2017\/01\/PriceTable04.jpg\",\"keywords\":[\"Build\",\"Video\"],\"articleSection\":[\"Inspiration\",\"Web Design\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/elementor.com\/blog\/how-to-design-price-table\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/elementor.com\/blog\/how-to-design-price-table\/\",\"url\":\"https:\/\/elementor.com\/blog\/how-to-design-price-table\/\",\"name\":\"10 Unique Pricing Table Examples for WordPress Using Elementor\",\"isPartOf\":{\"@id\":\"https:\/\/elementor.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/elementor.com\/blog\/how-to-design-price-table\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/elementor.com\/blog\/how-to-design-price-table\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2017\/01\/PriceTable04.jpg\",\"datePublished\":\"2017-02-13T11:41:50+00:00\",\"dateModified\":\"2025-12-06T16:33:53+00:00\",\"description\":\"Today, we are sharing some of our beautiful & highly converting WordPress pricing table examples, all made with Elementor Page Builder.\",\"breadcrumb\":{\"@id\":\"https:\/\/elementor.com\/blog\/how-to-design-price-table\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/elementor.com\/blog\/how-to-design-price-table\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/elementor.com\/blog\/how-to-design-price-table\/#primaryimage\",\"url\":\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2017\/01\/PriceTable04.jpg\",\"contentUrl\":\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2017\/01\/PriceTable04.jpg\",\"width\":1024,\"height\":682,\"caption\":\"Price Table 04\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/elementor.com\/blog\/how-to-design-price-table\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Blog\",\"item\":\"https:\/\/elementor.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Web Design\",\"item\":\"https:\/\/elementor.com\/blog\/category\/design\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"10 Unique Pricing Table Examples for WordPress, and How We Designed Them\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/elementor.com\/blog\/#website\",\"url\":\"https:\/\/elementor.com\/blog\/\",\"name\":\"Elementor\",\"description\":\"Website Builder for WordPress\",\"publisher\":{\"@id\":\"https:\/\/elementor.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/elementor.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/elementor.com\/blog\/#organization\",\"name\":\"Elementor\",\"url\":\"https:\/\/elementor.com\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/elementor.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2025\/06\/images.png\",\"contentUrl\":\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2025\/06\/images.png\",\"width\":225,\"height\":225,\"caption\":\"Elementor\"},\"image\":{\"@id\":\"https:\/\/elementor.com\/blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/elemntor\/\",\"https:\/\/x.com\/elemntor\",\"https:\/\/www.instagram.com\/elementor\/\",\"https:\/\/www.youtube.com\/channel\/UCt9kG_EDX8zwGSC1-ycJJVA?sub_confirmation=1\",\"https:\/\/en.wikipedia.org\/wiki\/Elementor\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/elementor.com\/blog\/#\/schema\/person\/c772e5251f765dce36a2b4989bad900a\",\"name\":\"Ben Pines\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/elementor.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/4635eef6208f12645017063c57db442067156b776efb0c13b3a26dfd96611e59?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/4635eef6208f12645017063c57db442067156b776efb0c13b3a26dfd96611e59?s=96&d=mm&r=g\",\"caption\":\"Ben Pines\"},\"description\":\"Building websites seems like the dream job, and it is, but you have to know much more than technical skills. My mission at Elementor is to teach web creators how to build a successful business they love.\",\"sameAs\":[\"https:\/\/elementor.com\"],\"url\":\"https:\/\/elementor.com\/blog\/author\/ben-pines\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"10 Unique Pricing Table Examples for WordPress Using Elementor","description":"Today, we are sharing some of our beautiful & highly converting WordPress pricing table examples, all made with Elementor Page Builder.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/elementor.com\/blog\/how-to-design-price-table\/","og_locale":"en_US","og_type":"article","og_title":"10 Unique Pricing Table Examples for WordPress Using Elementor","og_description":"Today, we are sharing some of our beautiful & highly converting WordPress pricing table examples, all made with Elementor Page Builder.","og_url":"https:\/\/elementor.com\/blog\/how-to-design-price-table\/","og_site_name":"Blog","article_publisher":"https:\/\/www.facebook.com\/elemntor\/","article_published_time":"2017-02-13T11:41:50+00:00","article_modified_time":"2025-12-06T16:33:53+00:00","og_image":[{"width":1024,"height":682,"url":"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2017\/01\/PriceTable04.jpg","type":"image\/jpeg"}],"author":"Ben Pines","twitter_card":"summary_large_image","twitter_creator":"@elemntor","twitter_site":"@elemntor","twitter_misc":{"Written by":"Ben Pines","Est. reading time":"8 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/elementor.com\/blog\/how-to-design-price-table\/#article","isPartOf":{"@id":"https:\/\/elementor.com\/blog\/how-to-design-price-table\/"},"author":{"name":"Ben Pines","@id":"https:\/\/elementor.com\/blog\/#\/schema\/person\/c772e5251f765dce36a2b4989bad900a"},"headline":"10 Unique Pricing Table Examples for WordPress, and How We Designed Them","datePublished":"2017-02-13T11:41:50+00:00","dateModified":"2025-12-06T16:33:53+00:00","mainEntityOfPage":{"@id":"https:\/\/elementor.com\/blog\/how-to-design-price-table\/"},"wordCount":1558,"commentCount":0,"publisher":{"@id":"https:\/\/elementor.com\/blog\/#organization"},"image":{"@id":"https:\/\/elementor.com\/blog\/how-to-design-price-table\/#primaryimage"},"thumbnailUrl":"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2017\/01\/PriceTable04.jpg","keywords":["Build","Video"],"articleSection":["Inspiration","Web Design"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/elementor.com\/blog\/how-to-design-price-table\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/elementor.com\/blog\/how-to-design-price-table\/","url":"https:\/\/elementor.com\/blog\/how-to-design-price-table\/","name":"10 Unique Pricing Table Examples for WordPress Using Elementor","isPartOf":{"@id":"https:\/\/elementor.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/elementor.com\/blog\/how-to-design-price-table\/#primaryimage"},"image":{"@id":"https:\/\/elementor.com\/blog\/how-to-design-price-table\/#primaryimage"},"thumbnailUrl":"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2017\/01\/PriceTable04.jpg","datePublished":"2017-02-13T11:41:50+00:00","dateModified":"2025-12-06T16:33:53+00:00","description":"Today, we are sharing some of our beautiful & highly converting WordPress pricing table examples, all made with Elementor Page Builder.","breadcrumb":{"@id":"https:\/\/elementor.com\/blog\/how-to-design-price-table\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/elementor.com\/blog\/how-to-design-price-table\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/elementor.com\/blog\/how-to-design-price-table\/#primaryimage","url":"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2017\/01\/PriceTable04.jpg","contentUrl":"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2017\/01\/PriceTable04.jpg","width":1024,"height":682,"caption":"Price Table 04"},{"@type":"BreadcrumbList","@id":"https:\/\/elementor.com\/blog\/how-to-design-price-table\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Blog","item":"https:\/\/elementor.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Web Design","item":"https:\/\/elementor.com\/blog\/category\/design\/"},{"@type":"ListItem","position":3,"name":"10 Unique Pricing Table Examples for WordPress, and How We Designed Them"}]},{"@type":"WebSite","@id":"https:\/\/elementor.com\/blog\/#website","url":"https:\/\/elementor.com\/blog\/","name":"Elementor","description":"Website Builder for WordPress","publisher":{"@id":"https:\/\/elementor.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/elementor.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/elementor.com\/blog\/#organization","name":"Elementor","url":"https:\/\/elementor.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/elementor.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2025\/06\/images.png","contentUrl":"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2025\/06\/images.png","width":225,"height":225,"caption":"Elementor"},"image":{"@id":"https:\/\/elementor.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/elemntor\/","https:\/\/x.com\/elemntor","https:\/\/www.instagram.com\/elementor\/","https:\/\/www.youtube.com\/channel\/UCt9kG_EDX8zwGSC1-ycJJVA?sub_confirmation=1","https:\/\/en.wikipedia.org\/wiki\/Elementor"]},{"@type":"Person","@id":"https:\/\/elementor.com\/blog\/#\/schema\/person\/c772e5251f765dce36a2b4989bad900a","name":"Ben Pines","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/elementor.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/4635eef6208f12645017063c57db442067156b776efb0c13b3a26dfd96611e59?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/4635eef6208f12645017063c57db442067156b776efb0c13b3a26dfd96611e59?s=96&d=mm&r=g","caption":"Ben Pines"},"description":"Building websites seems like the dream job, and it is, but you have to know much more than technical skills. My mission at Elementor is to teach web creators how to build a successful business they love.","sameAs":["https:\/\/elementor.com"],"url":"https:\/\/elementor.com\/blog\/author\/ben-pines\/"}]}},"_links":{"self":[{"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/posts\/1773","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/comments?post=1773"}],"version-history":[{"count":6,"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/posts\/1773\/revisions"}],"predecessor-version":[{"id":146866,"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/posts\/1773\/revisions\/146866"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/media\/1778"}],"wp:attachment":[{"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/media?parent=1773"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/categories?post=1773"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/tags?post=1773"},{"taxonomy":"marketing_persona","embeddable":true,"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/marketing_persona?post=1773"},{"taxonomy":"marketing_intent","embeddable":true,"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/marketing_intent?post=1773"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}