Plastic Button

Stuck on some ideas for your interface, especially in the navigation button area? Looking for a nice, subtle background for your navigation buttons that is both eye candy and subtle to other parts of your layout? Well, look no further, because now you can learn how to create a nice plastic-like background to those buttons. Step-by-Step instructions proceed...

1) Open up a new image, maybe about 250x250, create a new layer, and select your rectangular marquee tool. Make a selection of a fairly good size and fill it in with white (Alt+Backspace). For reference of the size of the rectangular selection, consider the image below.

2) Now, open up the Layers Palette (Windows>Layers) and click that little "f" at the bottom of your Layers Palette to open up your Layer Styles. Still make sure your new layer is selected. For out first Layer Style, we are going to select Bevel and Emboss. Use the exact settings posted below:

3) Keep your Layer Styles windows open because there is no sense in closing it because we are going to open it right back up. Anyways, directly under Bevel and Emboss, you will see a Layer Style called Contour. Click it and consult the image below..

4) Now we are going to have to apply a Gradient Overlay. So select that option from the menu and you will see the settings come up. You should see a color bar near the middle of the window with the gradient displayed in it. Click that color bar and you will see a window like that one below. Now, for the extreme left arrow (first square), click the arrow and you will see the Colors and Location options come up. For the color, click the color square and make the color #C9C9C9. Location should be 0%. The last arrow on the right, do the same thing as above, but set the color to #FFFFFF and the location to 100%. Click OK to get back to the Gradient Overlay window.

5) In the gradient overlay window, apply the settings displayed in the image below. Make sure you don't miss the Gray to White gradient required.

6) For our final Layer Style, we are going to apply a Stroke. Employ the options seen in the image below:

7) Once you are done, you should have something like this: