Pricing 5 block design & features
Pricing5 is a two-plan pricing section built with Shadcn UI, opening with a centered headline and description, then two card columns for the left and right plans. Each card centers the plan name, tagline, large price line, price note, and a full-width CTA with variant styling per plan. A vertical separator appears between cards on large screens where the right card drops its left border to read as one split module.
Beneath the cards, a comparison table lists feature names in the first column and plan values in the next two. Boolean cells render as check or minus icons; string cells show plain text. Table headers name each plan column, and rows stay hover-neutral for a documentation-like matrix feel.
The presentation is corporate and clarity-first, ideal when two tiers differ on many granular capabilities. Complexity is moderate to elaborate depending on how many table rows you add. Content-driven setup needs two plan summaries plus a feature list mixing booleans and strings.
On mobile the plan cards stack and the table scrolls horizontally when columns need more room than the viewport allows.