Pricing 71 block design & features
Built with shadcn/ui, this pricing section presents two plan cards side by side with a Switch control that toggles between monthly and yearly billing. Each card is wrapped in a Card shell with a header showing the plan name, a large price figure, and a period label, followed by a description and a full-width call-to-action button. The second card uses a soft muted fill to add visual weight without a colored border.
Below the button, a decorative ribbon built from two Separator lines flanking a centered “FEATURES” label creates a clear divider between the purchase action and the plan details. Each feature row pairs a BadgeCheck icon with the feature text, giving the list a polished, verified appearance that echoes the pattern used in three-plan carousel blocks.
The block is responsive through a two-column grid that collapses to a single column on smaller screens. The Switch sits between “Monthly” and “Yearly” text labels so the billing choice is always visible without extra chrome.
