[Library] Pricing

Pricing

Plans side by side, with the recommended one doing the asking. 3 patterns, 2 variations between them: every variation is its own copy-paste file, one click from its pattern.

Thumbnails on this page are rendered in Twenty Twenty-Five. Your theme is applied to every live preview, on a pattern's own page.

3patterns
5designs
What it holdsHolds as many entries as you have 1

3 patterns

Pricing duo rendered in Twenty Twenty-FiveThumbnail in Twenty Twenty-Five PricingStandard

Pricing duo

Two ways to pay for the same thing, head to head and equal, with the saving set in the ruled channel that runs between them. Neither side is taller, tinted or badged: the seam does the arguing. States no colour and no font of its own.

10 blocks · core only · 1 variation Preview Ledger seam
Pricing single rendered in Twenty Twenty-FiveThumbnail in Twenty Twenty-Five PricingStandard

Pricing single

One plan, set as a collision of scales: a price at display size in the left column against a packed ledger of ten ruled currentColor rows in the right, with one action and one reassurance line under the figure. For a product with a single price, where three columns would be an invention. The figure ships as an obvious placeholder. States no colour and no font of its own.

7 blocks · core only · 1 variation Preview Night plan
Pricing tiers rendered in Twenty Twenty-FiveThumbnail in Twenty Twenty-Five PricingStandard

Pricing tiers

Three pricing tiers where the recommended one is genuinely taller than its siblings and inverts to a contrast ground behind a 2px edge on that same chain, so the recommendation is structural rather than a badge. States no colour and no font of its own.

10 blocks · core only Preview
No patterns matchClear a filter to see all 3 patterns.

All sections