Step 1

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

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.

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.

Step 4

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

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

Congratulations, you now have a cool Navigation Menu to show off on your website

Author: Marcell Purham

Hey there! My name is Marcell Purham and I am a 17 year old web developer/ 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 would like to stalk me just follow me @marcellpurham

Related Post

• Create an astonishing soccer desktop wallpaper using photoshop

• Create a nice clean blog Layout in photoshop

• Create an awesome user friendly button in photoshop

• Create a awsesome images gallery using css3 and jquery

• Highlight Current Page in an HTML Document Using Css

• Create a stunning Droid like mobile cell phone in photoshop

• 4 quick tips to help you create a better mockup/design in photoshop

• PSD to Wordpress Series Part 3: Final Tutorial

Share