The signature moment
Elevated center tier with full checklist
Balanced triple card comparison. Highlights the core recommendation in the middle column with 2px border styling.
Theme handoff
What comes from where
From your theme
- The typeface.
- Your colours.
- Your buttons.
Full pattern notes
Why it works, and how it is built
Open a topic for the complete design reasoning, editing guidance and implementation notes.
Design rationaleComposition, intent and nearest alternatives
Overview
Three membership tier cards side by side: each card features a tier badge, price headline, ruled checklist of privileges, and a dedicated action button.
The signature moment: elevated center tier with full checklist
Balanced triple card comparison. Highlights the core recommendation in the middle column with 2px border styling.
Theme behaviourInheritance, fixed decisions and contrast
What it inherits from your theme
- The typeface. No font family is stated anywhere.
- Your colours.
basefor ground,contrastfor text and borders. - Your buttons. Inherits theme button styling.
Display type
Off the theme's ladder on purpose, because the size is the composition:
- paragraph at clamp(1.5rem, 2vw, 2rem)
Technical notesBlock mechanics, responsive behaviour and constraints
What happens at 390px
Columns stack into a single column on phones.
Questions
Tier comparison cards: common questions
Does Tier comparison cards need a plugin?
No. It is built only from core WordPress blocks (button, buttons, column, columns, group, heading, list, list-item and paragraph), so it pastes into the block editor with nothing to install.
Will Tier comparison cards match my theme?
Choose by variation. Paper and Night tier cards take your theme’s palette; Espresso and peach brings its own colours.
How many variations does Tier comparison cards have?
3: Paper, Espresso and peach and Night tier cards. Each is its own markup; choose one in the toolbar above the preview before you copy.
Is Tier comparison cards free?
It is included with a subscription, with every Core Pattern and variation. 62 Core Patterns are free to copy without one.
Which WordPress version does it need?
Requires a block theme on WordPress 7.0 to 7.1. Classic themes and page builders are outside our supported setup. Adaptive patterns use the block theme’s colour, spacing and typography presets; styled variations declare their own colours or type.
The markup
Core block markup and nothing else. Copy it, then paste it straight into the block editor: WordPress reads the delimiters and rebuilds the blocks.
Fetching the markup…Variation: Espresso and peach
Fetching the markup…Variation: Night tier cards
Fetching the markup…
