build 960 design grids in photoshop

Create a baseline grid

Designers use a grid of horizontal lines to align objects vertically and add consistent vertical space between them. This will make your site and packages look clean, polished and professional.  We're going to create a 10-point grid but 3- and 4-point grids are also common.

Add a new layer and name it Baseline. (Shift-Command-N)

Change Magnification to 500 percent and use the Navigator to move to the top-left corner.

Select the Single Row Marquee tool and click 10 pixels from the top. A selection will appear that is 1 pixel tall and extends all the way across the document.

Sinle-row marquee tool

Under File in the menu bar, select Fill… and in the Contents box select Black from the pull down menu and click OK.

With your line selected, hold down the Option key and press Command-T for the Free Transform tool. Press and hold the Shift key and press the Down Arrow on your keyboard. A copy of the selection will move exactly 10 points down. Hit Return.

Note: You can do this by hand but it's very easy to be off by a pixel. If you decide to try it, hold down the Option key and then press Shift-Command-T 5 times to to make sure your lines match the grid.

Baseline align


Change Magnification to 50 percent and keep tapping Option-Shift-Command-T until the grid is complete.

In your Layers panel, change the Opacity to 10 percent and change the Blending Mode from Normal to Multiply.