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

Navigation Bar


1. Open up a 500x500 document and create a new layer, select the marquee rectangle tool and select a selection that looks like this.

image 1

2. Select the gradient tool and start from the top to the bottom in the selection box with these colors

image 2

image 3

3. With the eraser tool, select the 'mode' as Pencil and choose the pencil tool for 1 pixel.

Start to erase parts of the image evenly so you have boxes to work with.

image 4

4. Right click on the layer on the layers panel and click on the blending options.

Use these options

image 5

image 6

5. After you're done that, your picture should look like this

Click to enlarge
Click to enlarge

6. Now you have to select a color, you can either CTRL + U and change the bars around or go to Image -> Adjustment -> Color Balance

With some other details I added, this is what I have.

Navigation Tutorial: Final Result (Click to enlarge)
Click to enlarge


Author's URL: Admin
Thank you for voting.
Rate this Materials:
Bad 
1 2 3 4 5 Excellent
print this page subscribe to newsletter subscribe to rss

Advance your current skills or acquire new skills in Photoshop by creating projects using our step-by-step tutorials. More Tutorials: Most Popular Materials | Fresh Materials | TutorialKit New Photoshop Tutorials

Add comments to "Navigation Bar"

Only registered users can write comment

No comments yet...