Web

Grid & PSD Files

Overview

This style guide is a tool to assist in the design of hbs.edu web properties with the goal of ensuring consistency of the Harvard Business School voice and brand and a consistent user experience.

There are two tiers of guidelines:

• Guidelines for the 1180-pixel grid (introduced in 2018)
• Guidelines for the 984-pixel grid (introduced in 2012)

All new sites should be coded to the 1180-pixel grid. The guidelines for the 984-pixel grid are included for redesigning sections of pre-existing sites.

All HBS sites are designed and coded responsively.

1180-Pixel Grid

All new sites should be coded to the 1180-pixel grid.

Files

• 1180-Pixel Grid
• Desktop PSD Template: Standard Page (1180-Pixel Grid & Standard Page Types) (9.6 MB)
• Color Palette

Desktop Grid

Both grids have 12 columns.

The 1180-pixel grid has 80-px (wide) columns and 20-px gutters.

Both grids use an 8-px baseline grid to establish a vertical rhythm and act as an aid for designing new desktop components.