Clear professional navigation bar

2 Comments
Navigation Bar, Web Graphics, Web Design

Make a Professional navigation bar, using some layer styles. Really easy to do and a good looking outcome.

1. Fist of all make a rectangle using the Rounded Rectangle Tool with 15px for Radius.

Free Photoshop Tutorials. Clear professional navigation bar

2. Open the Layer Styles and add it these styles, starting by an Inner Shadow.

Free Photoshop Tutorials. Clear professional navigation bar

3. Inner Glow

Free Photoshop Tutorials. Clear professional navigation bar

4. Gradient Overlay: #212121 to #383838

Free Photoshop Tutorials. Clear professional navigation bar

5. Stroke: #050505

Free Photoshop Tutorials. Clear professional navigation bar

6. And you should have something like this:

Free Photoshop Tutorials. Clear professional navigation bar

7. Then while holding Ctrl click over the layer’s thumb to make a selection and then create a New Layer and go to Select/Modify/Contract and put 1px then fill it with any color and change the Fill to 0%. Ctrl + D to deselect.

Free Photoshop Tutorials. Clear professional navigation bar

8. And add it a Stroke: Transparent to White.

Free Photoshop Tutorials. Clear professional navigation bar

9. And you have something like this:

Free Photoshop Tutorials. Clear professional navigation bar

10. Add some text using Segoe 13pt.

Free Photoshop Tutorials. Clear professional navigation bar

11. Add it a Drop Shadow

Free Photoshop Tutorials. Clear professional navigation bar

12. Then add it a Gradient Overlay: #b6b6b6 to #ffffff

Free Photoshop Tutorials. Clear professional navigation bar

13. And you are done.

Free Photoshop Tutorials. Clear professional navigation bar

Rate Tutorial:

1 Star2 Stars3 Stars4 Stars5 Stars

2 comments on this tutorial

nice tutorial but it does not reach international standards

Good day! Me credit is good enough. I am an active traveler therefore use frequent flier card to earn bonus miles. Now I am looking for one more rewards card. I am going to apply for a new one online at the site. But do not know for sure whether it is a real site or not. Could you answer me as soon as possible?

transfer balances onto one card

Leave a Reply