1

There are many good grids online (1200px.com, unsemantic.com) that can be downloaded as PSD and used in web design in Photoshop. Now I have 2 questions in relation with this:

  1. When I apply this template in my Photoshop document, they have small right and left margins, how do I adjust such templates to my needs because I want MORE white space, not 5-10px as the templates have? (do I go to canvas size and increase the size of canvas on both sides or else?)

  2. How to use same 12 column grid template for mobile web design?

May be I am thinking the wrong direction, I am just confused, your help would be appreciated

2

how do I adjust such templates to my needs because I want MORE white space

Griddify is a free plugin for PS that allows you to easily compose custom grid systems with columns and white spacing.

How to use same 12 column grid template for mobile web design?

Simply adjust the settings to fit your new screen size.

0

As Afterteam wrote Griddify is a cool plugin.

You can also use:

If you have Photoshop CC go to View\New Guide Layout and choose your measurements that you want to use :)

Your second question can be solved in two ways:

  • again like Afterteam wrote :)
  • set less number of columns (this same size as in desktop view) for mobile (example: Desktop: 12 column, Tablet 8 column, mobile 3 column)

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.