💲Pricing Table Generator

About this tool

Edit up to five plans, each with a name, price, billing period, description, features, button text and link. Mark the plan you want to highlight, then set the accent colour, currency symbol, corner rounding and badge text. The live preview updates as you type, and Copy gives you a single block of HTML and CSS to paste into any site.

Designing a pricing table that converts

A pricing table helps visitors choose quickly, so make the differences between plans obvious. Three plans is the classic sweet spot: enough choice to feel in control, few enough to decide. Put the plan most people should pick in the middle and highlight it with a badge, a stronger border and a filled button. This anchors the comparison, and the cheaper and more expensive options make it look like good value. Lead each card with the plan name and a one-line description of who it's for, show the price large with the billing period small, and list features as outcomes in the same order across plans so they're easy to compare. Use a clear call to action on every button. The generated table uses CSS grid, so the cards sit side by side on desktops and stack on phones automatically. All class names start with pt-, so they won't clash with your site's styles, and you can tweak the CSS freely. Everything you type is HTML-escaped, and button links must start with https://, mailto:, a slash or #, which blocks script injection. Honest limits: this is presentation only, with no payments, toggles for monthly/annual billing or feature comparison grid, so connect the buttons to your checkout or sign-up page. The HTML table generator, the CSS box-shadow generator and the colour palette generator are related.

Frequently asked questions