ux-cards

What problem does it solve? Card UIs often fail through card stuffing (multiple topics crammed into one container), shadow soup (shadows on the card, its image, and its buttons), and cards-for-everything (card grids where users need ranked, comparable results). This Skill applies practitioner judgment so cards stay one-topic, scannable, and appropriate to the browsing context. ## Core Features & Use Cases - Context gating: Determines whether cards are even the right pattern by distinguishing browsing from searching, content type (text, rich media, user cards), and action count before designing. - Always-apply core rules: Enforces one topic per card, internal visual hierarchy, progressive disclosure with truncated teasers, one shadow maximum, and consistent padding. - Context-dependent decisions: Surfaces trade-offs for elevated vs. outlined vs. flat containers, full-card clickability, media usage, and card grids vs. lists/tables. - Use Case: When asked to design a product listing grid, the Skill checks whether users browse or search, recommends rich media cards with one clear action, then hands off to heuristics, accessibility, aesthetics, and microcopy audit skills for validation. ## Quick Start Ask the assistant to design or review a card layout for your content, such as a product grid or user profile cards, and it will apply these card design rules.