Pricing 94 block design & features
Pricing94 is a four-tier pricing section built with Shadcn UI cards. A centered headline and optional description sit above a labeled switch that toggles all cards between monthly and yearly billing at once. Below, four equal columns each render a borderless card on the theme muted surface color, containing the plan name, a combined price and cadence line, a full-width CTA link, and a vertical checklist of features marked with small primary-tinted check icons.
The highlighted plan gains a slight scale increase and a primary-colored ring with ring offset, lifting it above its siblings so it reads as the recommended choice. Muted backgrounds keep every card on palette across light and dark themes without ad hoc gray values. Spacing between columns is tight enough for four cards to sit comfortably while each card retains generous internal padding.
The overall feel is bold and product-led, borrowing the ring-and-scale emphasis pattern rather than relying on filled backgrounds or colored borders. Complexity is moderate, driven by one shared billing toggle and four repeating card structures with no extra decorative elements beyond the ring highlight.
On smaller viewports the four columns collapse to a two-column grid, stacking naturally without a carousel or horizontal scroll.