Glossy Navigation Buttons

This tutorial with guide you through how to make a these glossy navigation buttons, which can be used throughout your site. Your result should be similar to this:

 

1.

Create a new document any size you want your button to be. I am using 80x20

2.

Fill the background with #333333

3.

Press Ctrl + A to select the whole canvas then go to Select » Modify » Border and set to 1px then press OK

4.

Then go to Select » Inverse

5.

Create a new layer and fill this with whatever colour you want. I am using #006699

6.

Using the rectantagular marquee tool draw a rectangle taking up 1/2 the height of the canvas like this:

7.

Create a new layer and fill it with White (#FFFFFF)

8.

Set the opacity of the layer down to 50%.

9.

Add some text and you are finished: