1bree Netpond Admin 5+ yrs Netpond Member 9 yrs View all articles | Contact author

These buttons are probably not exactly the size you might need, but for the purpose of this tutorial, they are a bit larger.

  

1. Open a new document. Name it glass button. Make it 100 X 100 pixels so you have room to work. Make the contents either white or transparent.
2. Make a new layer.
3. Select the elliptical marquee tool. Make sure it's set to make a new selection and anti-aliased is checked. Using a fixed size, set the width and height to 80 or 90.
4. Set your color chips to black and white.
5. Select the gradient tool. Make sure you have linear gradient selected. The gradient should be foreground to background. The Mode should be normal, Opacity 100%, Reverse and Dither should not be checked, but transparency should be checked.
6. Drag your mouse across the canvas/document from upper left to lower right making a gradient inside the circle.
7. You can do the next step one of two ways. You can either go Layer ---> Layer Style --->Bevel & Emboss. OR you can click on the little "f" in a circle at the bottom of the layers palette which pops up and menu from which you can choose bevel and emboss. Tinker with the settings until you find one that you like.
8. Next, you should go to Select --->Modify--->Contract 5. Make a new layer.
9. Fill the smaller circle with any color.
10. Open the styles palette. (Window-->show styles). In the styles palette, click on the small arrow in the upper right corner for the pop up menu. Choose "small list."
11. From the small list find "Blue Glass Button." Click and drag to your canvas/document or simply just click!!
12. Viola! Glass button.
13. Now if you choose "Load buttons" with the glass button selected you should be able to "append" and add more glass styles to make several colors.
14. Use the type tool to add text to your buttons.
15. Then save for web. If you choose a transparent background you will want to save as a gif (make sure transparency is checked in the optimize box). If your background is white, you can save as a jpg.