Create a clean Navigation menu


Step 1

Create new document 800x 200 pixels with background color #212121
Create New document

Step 2

Next set the your foreground color #00b5e9, Select the rectangle marquee tool and create a rectangle box across leaving about 20px on both sides.
Set colors

Step 3

Now let’s add a gradient overlay to our new rectangle layer. Right click on layer>Blending Options>Gradient overlay. Now lets add a stroke to our Nav. 1px color#fff.
Add Gradient
Add Text

Step 4

Ok it is now time to add some text to our Nav.
Add Text

Step 5

For the final step we will add some dividers between our text.

Select the rectangle marquee tool color #fff, and make a 1px line like the one below, Then duplicate the layers
Final
Congratulations, you now have a cool Navigation Menu to show off on your website

title

Tags: , ,

Author: Marcell Purham

Hey there! My name is Marcell Purham and I am a 18 year old web & Graphic designer from Chicago IL. When I'm not designing or coding things up I'm probably skateboarding, or gaming, or just being the average human. If you're looking for me you can probably find me via @marcellpurham


Share

  • Share

2 Responses


  1. Mike says:

    Great tutorial! Love the final outcome

  2. Bdsurf says:

    I am learning photoshop now and I think this navigation bar tips will help me to a lot to make unique design. I liked this tutorial a lot.


Leave a Comment

CommentLuv Enabled