Vectorials
Flash Perfection
3D Lessons
Tutorialkit
Markup Tutorials
Learn PHP
network
adv banner
Photoshop  Home Photoshop Web Layout Glossy Nav Bar
rss

Glossy Nav Bar

Author: PhotoshopStar More by this author


1. New Document

First make a new document in which you can make this sleek nav bar! (I used a regular template size of (800x1000)

2. Starting the bar

Create a new layer and make a selection sized 780x30, fill the selection with #52A1C4

image 1

Now apply this Gradient Overlay:

image 2

3. Shine

Create a new layer and select the main bar layer (CTRL + Click Layer), now edit the selection down 1 pixel by going to Select > Modify > Contract in the menu

image 3

image 4

image 5

After that get the gradient tool image 6 and get the Foreground to Transparent gradient image 7

From the top of the selection make a gradient into the middle area like so:

image 8

Now a much smaller gradient at the bottom:

image 9

Set the layer mode to Overlay

image 10

4. Text

I used: Tahoma, 11 pt, Bold, White with a 100% Drop Shadow

image 11

Finished:

Glossy Nav Bar Tutorial: Final Result



Author's URL: www.photoshopstar.com

Rate this Material: Bad 1 2 3 4 5 Excellent
print this page tell a friend subscribe to newsletter subscribe to rss

Add comments to "Glossy Nav Bar"