Pricing stack tiers

Four pricing cards built as plan sheets: a numbered header, a large price beside a compact feature ledger, and a ruled footer. The Studio plan lands last, with an inverted surface and the only plan button. Prices describe a fictional studio and are placeholders, not Pattern Paste prices.

The sequence ends on a decision. Starter, Freelance and Agency establish the range; Studio arrives last and remains face up with the action. The largest price is encountered before the recommendation. A wide price column and a dense feature column make the plan understandable at a glance.

Pricing uses four plan sheets, a slower deal and a single inverted recommendation. Its dominant mark is the price, with a compact feature ledger alongside. The process has six alternating surfaces and a large phase number.

1. The words and prices. Edit the ordinary core blocks inside each Card group. Replace the fictional figures, billing terms and inclusions. Keep the copy concise enough to fit a phone.
2. The order and count. Duplicate, remove or reorder Card groups in List View. Keep the recommendation last and update its button destination. The block derives the live counter and scroll length from the actual card count.
3. The card surfaces. Preserve an opaque base or contrast ground on every Card group while the block’s plate is off. Edit the paired ink at the same time.
4. The masthead and hand-off. Both are ordinary groups outside the pinned block. Replace the hand-off link destination.
5. Motion. The inspector provides the switch, deal, peek, depth, shrink, dim, overshoot, lean, width, minimum card height, gap, plate and counter. A larger card or deeper pile needs more room in the viewport.
6. Heading levels. The masthead is h2 and the card titles are h3. Adjust these to the surrounding page’s outline.

• Every typeface comes from the theme.
• Surfaces and their ink use paired base and contrast chains with core fallbacks. Inverted cards reverse the pair. Every heading states its own colour.
• The masthead follows the x-large type rung and its introduction follows medium. Plan names follow the large rung.
• Outer vertical spacing uses core spacing presets. The hand-off button follows the theme’s button styling. The button on the inverted card explicitly uses base and contrast so its label remains legible.

• Display type. Prices use a 3.5rem to 6.5rem clamp, tight tracking and a line-height of 1. These proportions stay independent of the theme ladder. Compact card copy uses a 1rem to 1.125rem clamp, line-height 1.55, because it lives in a narrow column. Footers and feature rows have a 15px floor. Tracked header labels are incidental apparatus.
• The card surface. The block’s plate is off. Every Card group supplies its own opaque ground, matching ink, one-pixel currentColor border, one-rem corners and fluid horizontal padding. The design therefore survives plugin deactivation. It needs no pattern-specific CSS.
• The layout. Core columns divide the price from the inclusions and stack below WordPress’s mobile breakpoint. Header and footer rows wrap. Cards use a vertical flex layout so the footer stays at the foot of the full surface.
• The pile. A 1080px deck, three moving levels, 28px peeks, three-percent shrink and ten-percent dim leave clear card edges. The velocity lean is four degrees. Each plan takes 110 percent of a screen to arrive. The card group’s 380px minimum is a floor; content may make it taller.
• Contrast. Ordinary copy must reach 4.5:1 in the rendered themes; large display type may use the 3:1 floor. These are measured in the verification loop.

Install the companion plugin, included with access, before pasting. The pattern embeds patternpaste/stack and an absent block registration shows a missing-block placeholder in the editor.

With motion enabled the frame pins while the cards are dealt, then releases on the final card. Scrolling back reverses the sequence. The counter follows the current card. Nothing moves while the page is still.

With motion off, reduced motion requested, or JavaScript unavailable, all four cards form a plain column with their complete content visible. With the plugin deactivated, the same core groups retain their backgrounds, borders, padding and composition. The plugin’s deck width and inter-card layout go with the wrapper.

The theme matrix and responsive checks cover the supported authoring themes, not every possible type scale or amount of replacement copy. Test a long translation and your own theme before publishing. The effect does not measure whether a visitor understands a process or prefers a particular plan.