Grid Layout

Product Highlight Grid

An editorial-style grid that mixes large feature products with complementary items in a multi-size layout.

Product Highlight Grid (Mixed Sizes)

Replace this placeholder with the actual screenshot

Asymmetrical Design

The Highlight Grid breaks the standard row-based product list by emphasizing a "Hero" product in a larger tile, surrounded by smaller, supporting items. This is ideal for announcing new drops or best-sellers.

Responsive Behavior

The grid automatically adapts to ensure a smooth shopping experience:

  • Desktop: 3-column layout with a 2x2 span for the hero item.
  • Mobile: Collapses to a single-column stack with optimized image heights.