Card UI is a design pattern where content is organized into distinct rectangular containers — each card holding a related cluster of information like an icon, heading, short description, and sometimes a link. Think Pinterest, but applied to landing page feature sections, pricing tiers, and testimonials.
Cards work because they exploit a Gestalt principle: elements enclosed together are perceived as a group. Instead of parsing a flowing page of text, the brain can process each card as a discrete unit. This dramatically improves scannability. In heatmap data, card-based feature sections consistently show more even engagement across items than list-based alternatives where the first item gets most attention.
Card design that converts
Three rules for effective cards on landing pages: (1) Keep content per card roughly equal in length — one card with a paragraph and another with a sentence looks broken, (2) Use 3 or 4 cards per row maximum on desktop; more than that and scanning advantage disappears, (3) Make clickable cards obviously clickable with hover states and visual affordances. Nothing frustrates users more than trying to click a card that isn't interactive.
The most underrated card trick: use a single "highlighted" card to guide choice. Pricing pages do this well — making the recommended plan card slightly larger or adding a border. The same principle applies to feature cards when you want to draw attention to a key differentiator.