Photoshop  Home Photoshop Web Layout Create a Pixel Menu
rss

Create a Pixel Menu

Author: Tutorialweb 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 ( ) 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" ( ) 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 Tutorial: Final Result



Rate this Material: Bad 1 2 3 4 5 Excellent
print this page tell a friend subscribe to newsletter subscribe to rss

Add comments to "Create a Pixel Menu"