The technique you learn from this tutorial will probably prove very useful to you in future designs. It will show you how to make a quick and easy “soft” beveled edge, which you can apply to your interfaces, buttons, etc, to add some instant good-looking depth. For this tutorial, we will make a button using the technique.
Step 1
Start by creating a new document—use the Rounded Rectangle tool to draw a pill-shaped button (for older versions of Photoshop, please refer to the Rounded Edges tutorial [1], and then return here). Once you have your shape you wish to make silver, follow the steps below.
Step 2
First, make a new layer and name it button (which should have your shape selection on it). Press D on your keyboard in order to set your foreground color to black and your background color to white. Now, go to Filter » Render » Clouds — Press Cmd+F (PC: Ctrl+F) until you have the clouds the way you want them (you might also try using Difference Clouds for a different effect if you want).
Step 3
Now, make a new layer. Choose Select » Modify » Border, and set the value to about 6 (this may differ in your situation). Then choose Select » Feather, and set the value to around half of the number you set the border to—in this case it would be 3.
Step 4
Next, press Alt+Delete on your keyboard to fill the feathered selection with Black (which should still be your foreground color). Press Cmd+D (PC: Ctrl+D) to deselect.
Step 5
Now, hold Command (PC: Control) and click on the button layer to get the selection back—make sure you are still on the layer with the black shading though. Go to Select » Inverse to select the excess black and press Delete to get rid of it.
Step 6
Press Cmd+D (PC: Ctrl+D) to deselect and you have your very own silver button! You may then choose to fill the background layer with a seamless texture [2], add some text, or perhaps place your button on your website’s layout/interface.