1. Start off with a 150x150px white background. Now go edit - fill - choose the background color of your site and press OK!
Now create a small selection similar to the one I created below:
2. Create a new layer and fill your selection with a color you like.
Deselect. Zoom into the corners of your rectangle, and delete 1 px of each corner like I did it below:
3. Now all corners are cut off. Hold ctrl and click your layer. Create a new layer and go edit - stroke - 1 px (#000000) center. Now go to your first layer and go layer - layer styles - and use these settings for bevel and emboss:
4. Now we want to give it a glossy look. Select your first layer (ctrl + click on it at the layers palette). Now that you got a selection around it, create a new layer. Hold alt and use your elliptical marquee tool and draw a nice circle in your other selection like I did below:
5. In your new layer, fill this selection with white opacity 25%.
Then add the text (I prefer pixel fonts - dafont.com has some nice ones!) you want in the button. You can then duplicate the button and use different text on it to make it a menu. You can even use mouse covers! That is up to you.


More Tutorials:



