Learn to make a good looking Navigation bar with a Professional Web 2.0 style, using layer styles and also you can add it a nice and simple hover.
1. Make a rectangle with the Rounded Rectangle Tool, as shown below.
2. Add it some Layer Styles starting with a Drop Shadow.
3. Then a Inner Glow.
4. Gradient Overlay. #212121, #424242 to #3e3e3e
5. Stroke. #2a2a2a
6. You should have something like this:
7. Add some text using Trebuchet MS Bold 15 pt, a/a Strong.
8. Then add it a Drop Shadow.
9. And you got something like this:
10. Then make some stripes using the Type Tool and #b3b3b3 as color, as shown below and then change the mode to Vivid Light. (use the following character | for the stripes)
11. And if you want you can add it a hover, using #aefa1d as color.
Rate Tutorial:
10 comments on this tutorial
Great tutorial, thanks.
Thank you for your comments ^^
[…] PSCloud Posted in Photoshop, […]
Excellent tutorial. Well done.
Nice ‘n’ Easy 
Nice tutorial. Very easy to follow.
I like this tutorial, but the inner glow is a little much.
If you want it at that size, usually a lower opacity works best, or soft light.
Myself I go for the 1 px inner stroke to make it look like a double border 
I think the submit button below the comment box has it actually.
Thanks for the tutorial. I found it looking good with the diamond in the first part of the gradient at 90%.
Thanks, this helps a lot!
Let’s me think about a header i have seen before, but not as tutorial.
I like the result, really