When the user wants to design, optimize, or audit card layouts for content display. Also use when the user mentions "card layout," "card component," "card…
Components: Card Layout Guides card layout design for scannable, responsive content display. Cards are self-contained containers that group related content; used in grids for blog posts, products, templates, tools, features, galleries, and integrations. When invoking: On first use, if helpful, open with 1–2 sentences on what this skill covers and why it matters, then provide the main output. On subsequent use or when the user asks to skip, go directly to the main output. Card Anatomy Element Purpose Container Border, background, shadow; consistent padding Image / Thumbnail Visual anchor; consistent aspect ratio (1:1, 4:3 common) Title Clear; keyword-rich where relevant Description / Metadata Supporting text; date, author, category CTA Action button or link; "View," "Use," "Connect," etc. Principle: One card = one topic. Keep each card focused for scannability. Card Types by Use Case
don't have the plugin yet? install it then click "run inline in claude" again.