Grasp the chance to enhance your site with the best fitting layout, including elements like buttons, headers and logos.  Home Photoshop Web Layout Create Some Cool Navigational Bar

Create Some Cool Navigational Bar


1. Start with your new document. Create a New layer and give it a name "Base". Set your background color to #FF9933 and foreground color to #CC6600.

Select Rounded Rectangle Tool and Draw a long rectangular button. Now Select Reflected Gradient Tool and Fill this layer with Reflected Gradient from Up to Down.

image 1

2. Select the Base layer (Ctrl + Move click). Create New layer and rename it to "UpperGlow". Contract the base layer with 3 Px, Select >Modify>Contract. Apply Feather with 3 Px, Select>Feather.

Press "D" to reset the colors. Press "X" to exchange the colors. Select Gradient Tool and select "Foreground to transparent" and fill the "UpperrGlow" layer with gradient, Apply from Upper to middle of the selection.

image 2

3. Now again select the "Base" layer. Select Lasso Tool from the Tool Bar and set its mode to "Subtract from Selection". Apply feather with 3 Px. Subtract the Base layer selection like this:

image 3

Create New layer and give it a name " Lower Glow". Fill it with White and set its layer mode to "Overlay" and set its Opacity up to 40%.

4. Ok, Select Line Tool, and set its weight to 2 Px. Draw a Small straight Line (Hold down Shift Key to draw a straight line) and apply Shear filter to it to give this straight line a different shapes.

image 4

image 5

Apply Drop Shadow and Color overlay to Line:

image 6

image 7

Here is the result:

image 8

Create Some Cool Navigational Bar



Author's URL: Tutorialscenter.com
Final results of our readers
New!
Passed through all the steps? Share your result!
Your result will be premoderated.
Please make sure you choose the right image.
 
 



Captcha

*Required fileds
Grasp the chance to enhance your site with the best fitting layout, including elements like buttons, headers and logos. More Web Layout Tutorials: Featured Materials | Fresh Materials | TutorialKit New Photoshop Tutorials

No comments yet...
Add comments to "Create Some Cool Navigational Bar"

Captcha