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

Chrome Menu


1. New document, 250x400 pixels and a white background.

2. Create a New Layer.

3. Using the Polygonal Lasso Tool, draw a basic shape and fill it with black. Anything like mine will do, but be creative!



4. Right click on the top layer, and select Blending Options. I added quite a few, Drop Shadow with 75% Opacity; 5px Distance and 5px Size. Inner Shadow with 25% Opacity; 5px Distance and 5px Size. Stroke with 1px Size, #000000 colour and 100% Opacity. Colour Overlay of #CCCCCC and 100% Opacity. And finally, here are my settings for Bevel and Emboss.



And this is how mine is looking now...



6. Create a new layer underneath your basic shape you created before.

7. Now time for some buttons. Using the Polygonal Lasso Tool again, make a selection and fill it with black.



8. Now right click on the button layer, and select Blending Options. I used a Drop Shadow on 75% Opacity; 5px Distance and 5px Size. A Stroke on 1px size, 50% Opacity and #000000 in colour. And finally, I applied a Gradient Overlay with the following gradient I whipped up quickly.



And here is my button...



9. Now time to duplicate the button layer and space them out nicely.

10. Lastly, add some text to each button. I added some different coloured strokes to each to show you how they look and I made a quick stripey background for fun. I think there is a hidden message in the text too, but I can't work it out. Enjoy! =]

Chrome Menu

Author's URL: Crunked-Designs.com
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 "Chrome Menu"

Captcha