Photoshop  Home Photoshop Web Layout Brushed Chrome Menu
rss

Brushed Chrome Menu

Author: GreyCobra.com More by this author


1. Create a new document.  This document should be a bit larger than your actual menu bar, My final result will be 700x50, so I will start at 750x100.  Select your Gradient Tool.

image 1

2. Select the preset gradient that goes from your foreground color to background color, and then select a medium grey as your foreground, and a lighter grey for your background:

image 2

The Top left gradient preset should be your Foreground to Background Color.

image 3

Your foreground and background colors should look similar to this.

3. Now, while holding shift, drag a line with your mouse from the top of your document to the bottom to fill it with your gradient (Shift will create a vertical line):

Click to enlarge
Click to enlarge

4. Now add a noise to your document (Filter > Noise > Add Noise).  Use the default settings but check monochromatic, and click ok.

Click to enlarge
Click to enlarge

5. Add a Motion Blur (Filter > Blur > Motion Blur), and use the following settings:

image 6

Click to enlarge
Click to enlarge

6. Create a new document with your actual width and height.  Copy your previous document and paste it into the new one.  This will get rid of the ugly edges:

Click to enlarge
Click to enlarge

7. Now get out your rounded Rectangle Shape Tool:

image 9

8. Drag a rectangle shape onto your menu:

image 10

9. Select the shape by holding Ctrl+Clicking the shape layer.  Make the layer invisible (click the eye), and create a new layer. 

image 11

10. Now select the bottom layer (the one with the brushed chrome), and copy the selection.  Go back to your new layer, and paste.  Now add an inner shadow like this in its blending options:

image 12

Click to enlarge
Click to enlarge

11. Add a color overlay:

image 14

And a Gradient Overlay:

image 15

And Now Duplicate the buttons until you have enough for your links:

Brushed Chrome Menu Tutorial: Final Result (Click to enlarge)
Click to enlarge

Good Luck!



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 "Brushed Chrome Menu"