/api /r tokens.json GitHub

Home Grid

9-card responsive category browse grid for the documentation wiki home page. Always renders all 9 ratified categories regardless of article count — including empty categories with '0 articles — in preparation' placeholder. 3-col → 2-col (960px) → 1-col (640px). Carbon Tile pattern extended with a top-3 child list + 'More →' link per card.

Live previewrendered from recipe via {tokens} resolution
populated

Browse by category

Help

0 articles — in preparation

Card shows count + top-3 child links + 'More →' link.

empty

Browse by category

Help

0 articles — in preparation

Card shows '0 articles — in preparation' only. No child list, no More link.

ARIA notes

<section aria-label='Browse by category'> carries the visual heading via aria-label so screen readers announce the region. Card role: plain <article> (no role override). Heading hierarchy: h2 for section heading, h3 for card title. :focus-visible ring on every link. Keyboard: tab order follows DOM order (ratified 9-category render order).

The usage tab for this component is not yet authored. Creative Design Contributors — pick this up.

Recipe is at /api/components/home-grid.json.