ux-research checked

Cards: UI-Component Definition

Explains cards as bounded summaries of related information that link to details, group several information types, support flexible layouts, and work better for browsing heterogeneous items than for dense search or comparison.

Open source

Pattern Decisions This Source Supports

Pattern Supported decision Required contract Claim note
Card grid Choose card grid when users need to see multiple objects at once and visual preview or compact card identity helps them choose. Each card represents one object and keeps title, preview, key metadata, state, and actions in the same relative positions across cards. Supports card components as short bounded object summaries and cautions about when cards are less suitable than dense scanning layouts.
Card list Choose card list when each item needs more context, imagery, or mixed metadata than a dense row can comfortably show. Each card represents one object or concept and exposes one primary identity that stays visible across all states. NN/g supports card boundaries, grouped related information, detail-entry behavior, flexible layouts, and cautions against cards for dense search and comparison.

Evidence Role

This source is treated as ux-research evidence. Use it to validate the decision rules above, not as a visual style reference.

Publisher: Nielsen Norman Group. Last checked: .