MOCKUP · Card treatments for resources & articles without photos · pick a direction All mockups · Pattern library
Design decision

Cards without photos

Most resources and articles will not have a featured image. Instead of empty boxes or stock photos, both options build the visual from each item's topic (color) and resource type (icon), so a grid stays varied and on-brand. A real photo still drops into the same slot when one exists.

Option A · Icon tile

A topic-tinted header with a resource-type icon and the type label. Colorful and quick to scan by type. Recommended for grids (home, library, related).

Option B · Text-forward, color chip

No media area. A solid topic-color icon chip brings the color in as a contained shape (no border lines), with a longer excerpt. Densest and most honest for long lists, and the lightest to build.

My take

Lead with Option A for grids (home, library, related), where the type icon plus topic color reads fast and a real photo can drop in later. Use Option B for long or dense lists (search results, category pages), where speed of scanning beats imagery. Tell me which to roll out and I'll apply it across the real pages.