1. Make a new document. Now choose your background color. I used #CCCCCC.
2. Grab the Rectangular Marquee Tool and make a selection like mine below:
Now make a new Layer in your Layers window. Make sure you are on the new layer and then paint the selection in with any color you want. I used #464646.
3. Now we want to make another new layer. This will be the border layer. So you want to use the Rectangular Marquee Tool once again. Start off by making a selection like mine below:
Fill it in with any color you choose. I used #717171. After filling in the selection click the Marquee Tool again and press the arrow keys to move the selection over the the right so we can also fill it in (note that we are still on the same layer (Layer #3)).
Ok few more selections left to do! Now we want to make a horizontal selection like mine below:
Also fill it in and move the selection down to the bottom to complete the border:
4. We got the hard part of the button done now. All we got to do is add blending options to our 2 layers:
Feel free to use any type of blending options you want. It is always best to learn what all the blending options do. Or you can use all my settings below:
For Layer #2 (border layer):
Gradient Editing:
For Layer #1:
Hope you enjoyed the tutorial!
More Tutorials: 
