Use the 3×3 grid to structure layouts, align elements, and create consistency across applications.
Built from the proportions of the Lenovo logo, the grid connects every layout back to our most recognizable asset.
Overview
The 3×3 grid is made up of:
Unit – A single square used to build the grid
Columns (1×3) – Three units stacked vertically
Rows (3×1) – Three units arranged horizontally
Subgrids – Smaller 3×3 grids that fit within a single unit
Using the grid
Start by sizing the 3×3 grid to the shortest side of the layout.
Step 1
Place the grid within the layout, either centered or aligned to an edge. Use subgrids separately to define margins.
Step 2
Add rows or columns as needed to support the layout.
Step 3
Use the grid and subgrids to align elements, size the Lenovo logo, and maintain consistent spacing and placement.
Applications
See examples below for how the 3×3 grid brings structure and consistency across different layouts.
