Component pattern · updated 3 Sept 2026
Pricing table
A pricing table lays out two to four plans side by side so a buyer can compare price, limits and features in one glance. The layout is a grid of equal columns with one column visually promoted, and a monthly-or-annual toggle is common enough to count as part of the pattern.
Think of it as
A restaurant menu with three set meals. The middle one is priced to look like the sensible choice, and the layout is doing that work, not the food.
Worked example
The pattern is easy to spot in a decode: three or four columns of identical width, a single column with a different background or border, and a repeated checkmark glyph. On our comparison of gallery submission fees, the honest version of this pattern lists a price only where one is published and prints "not published" where it is not, rather than leaving a cell blank.
Why it matters
A pricing table is the one component where a design system's restraint is tested by a business incentive. The promoted column wants a second primary colour; the design system says there is only one. How a site resolves that tells you how disciplined the rest of it is.
How it fails
A promoted column styled as a second primary button colour, breaking the one-primary rule. Feature rows that use icons with no text alternative. Prices injected by script so a crawler reads a placeholder.
What to measure open the decoder →
- Number of distinct button styles across the columns
- Whether the promoted column introduces a colour outside the token set
- Contrast of muted "not included" rows, which are usually the first to fail AA
- Whether the price text is in the served HTML
Where you meet it
- SaaS marketing sites
- API and developer tool sites
- Membership and course sites
On this site
The submission-cost comparison is a pricing table about other people's prices, which is why every cell is either first-party or marked as not published.
Showcase collections that exhibit it
Build it
Next rung
When plans differ by more than price, the table becomes a feature comparison, and the same discipline about what is measured versus asserted applies.