About this template

The purpose of this template is to allow you to create visual design comps that are designed to be implemented using a CSS layout framework. The Photoshop document features a 24 column grid for CSS frameworks such as Blueprint. It consists of guides that comply with Blueprint’s grid of 24 columns of 30px, 10px wide gutters, and a horizontal width of 950px. Horizontal guides are provided at 18px or 1.5 em line-height for 12 px base font.

To make the most of this system, a designer can complete their process by using other templates and tools that utilize the same grid system, such as printable graph paper, graph paper notepads, and wireframe template.

Related information

Find out more about Grid System CSS frameworks at the following sites:

For more information about web site grids, you may be interested in the following articles.


Download the Photoshop Template
This template is free to use, but may not be distributed without permission. If you like it, a donation is appreciated.