first commit

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

@@ -0,0 +1,36 @@
+# 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