agent-skills/sn-infographic/references/layouts/tile-layout.md

tile-layout

Metro-style tiles with blocky color entrances.

Structure

• Grid of rectangular tiles in varied sizes
• Each tile is a solid color block with icon and label
• Inspired by Windows Metro / Material Design tile systems
• Tiles may be 1×1, 2×1, or 2×2 units

Best For

• App or feature navigation overviews
• Category or topic indexes
• Dashboard entry points
• Color-coded classification systems

Visual Elements

• Bold solid-color tile backgrounds
• Large icon centered in each tile
• Short label below or over the icon
• Consistent tile border radius

Text Placement

• Label within each tile
• Optional subtitle below the label
• Section title above tile groups

Recommended Pairings

• corporate-memphis: Vibrant flat tile grids
• high-contrast-ad: High-contrast color blocks
• pixel-art: Retro tile-based interfaces