Grasp the chance to enhance your site with the best fitting layout, including elements like buttons, headers and logos.  Home Photoshop Web Layout Link Seperators

Link Seperators


Step 1

Get a simple navigation bar ready for this.

image 1

Step 2

Create a new layer and make a vertical line inside this navigation bar. Make sure the color is set to black. I zoomed in so you can see.

image 2

Step 3

Now duplicate it and nudge it 1px to the right. Change the color of this line to white.

image 3

Step 4

Set the layer with the black line to 50% opacity and 50% fill. Set the layer with the white line to 80% opacity and 80% fill.

image 4

Step 5

Merge the 2 layers together and duplicate it as many times as needed to accommodate for the amount of links you have. Also, make sure you align them with your text.

image 5

Final Result:

Link Seperators



Author's URL: Amoebic Tutorials
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 "Link Seperators"

Captcha