Grasp the chance to enhance your site with the best fitting layout, including elements like buttons, headers and logos.  Home Photoshop Web Layout Create a Pixel Menu

Create a Pixel Menu


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



Author's URL: Tutorialweb
Final results of our readers
New!
Passed through all the steps? Share your result!
Your result will be premoderated.
Please make sure you choose the right image.
 
 



Captcha

*Required fileds
Grasp the chance to enhance your site with the best fitting layout, including elements like buttons, headers and logos. More Web Layout Tutorials: Featured Materials | Fresh Materials | TutorialKit New Photoshop Tutorials

No comments yet...
Add comments to "Create a Pixel Menu"

Captcha