Her

Home Photoshop Tutorials Web Layout Create a Pixel Menu

Create a Pixel Menu

Author: Tutorialweb Author's URL: http://tutorialweb.org More by this author

Here is a cool pixel menu for your website.

Open a new 150px x 160px document and fill the background layer with white.

Create a new layer, and with the "Rectangle Tool", holding the Shift key down, draw a little perfect square.

image 1

Open the blending option panel of this layer ( image 2 ) and set:

image 3

image 4

image 5

Now create a new layer and with the "Rectangle Tool" draw a rectangle a little small in height than the previous but with a triple weight.

image 6

Move this layer down the previous.

Open the "Blending Options" panel and set:

image 7

image 8

image 9

Create a new level and with the "Line Tool" draw 2 vertical line (1px) like this:

image 10

Create now a new layer and with the "Rounded rectangle tool" ( image 11 ) with 4px of radius draw a little rectangle over the 2 lines.

image 12

Open the blending options panel and set:

image 13

image 14

image 15

Duplicate this layer for each menu voice you need.

Now duplicate again the layer but place it at the end of the 2 lines.

Open the blending options panel and set:

image 16

image 17

image 18

Here is what you get:

image 19

That's all, add now your text, and your pixel menu is ready to use.

Create a Pixel Menu