Drawing a stylish button for a website in Photoshop is not that difficult. This process will take you only 10-20 minutes. The button you can create with this tutorial sits on a light background. Optionally, you can place the button on a dark background. And also show your imagination and create it in a style that will fit into the design of your site.
Instructions
Step 1
Create a new document using the keyboard shortcut Ctrl + N.
Step 2
Set the size you want, for example 200 by 100 pixels.
Step 3
The document was created. Now you can start creating the button.
Step 4
Select the Rounded Rectangle Tool U from the tool palette. Then select the Shape Layer mode, which is located under the main menu in the Options Bar, for the settings of the active tool.
Step 5
Draw a button in the document. In this example, the foreground color is black, so the button is black. Next, we will select a suitable color for it.
Step 6
To do this, go to the Styles palette and select the appropriate style for our button.
Step 7
This example uses the Blue Glass style.
Step 8
Rasterize the top layer: menu "Layer" - command "Rasterize" - item "Layer".
Step 9
Press the Ctrl key and, while holding it, select the top layer icon with the left mouse button. The button will be highlighted with a dotted line.
Step 10
To create a small border around the edges of the button, click Select - Modify - Shrink.
Step 11
In the window that opens, set 3 pixels.
Step 12
The result is a dotted stroke.
Step 13
Invert the selection using the Shift + Ctrl + I keyboard shortcut.
Step 14
Copy the selection to a new layer by pressing Ctrl + J. The third layer will appear in the "Layers" palette.
Step 15
Choose a style you like for a small 3-pixel border. To do this, go to the Styles palette again and select the one you want. In this example, the Chiseled sky border style is applied, because it matches the color of the button.
Step 16
The result is such a button. Optionally, you can apply your own styles that you like best.
Step 17
It remains to write the text. To do this, select the Horizontal Type Tool (T). You can choose font options in the options bar for setting this tool.
Step 18
Now your button is ready.
