Vectorials
Flash Perfection
3D Lessons
Tutorialkit
Markup Tutorials
Learn PHP
network
adv banner
Photoshop  Home Photoshop Web Layout Professional Forum Buttons
rss

Professional Forum Buttons

Author: Imgry.com More by this author


Step 1 - Open Your Canvas

Open up a new document 200x100, fill the background white. This will be the background for our first forum button.

image 1

Step 2 - New Layer

Create a new layer (Ctrl+shift+new), set the foreground color to black by pressing D on your keyboard.

image 2

Step 3 - Size Your Button

Select the rectangle tool and make a box the size you want the button to be. I want my button to be significantly smaller than the canvas I chose so mine looks something like this.

image 3

Step 4 - Add Some Style

Right click the layer you just made your button on and go to blending options, use the following settings for Drop Shadow, Inner Shadow, Bevel and Emboss and Gradient Overlay (Click Image To Full View).

image 4

Step 5 - Gradient

Create a new layer, select the gradient tool with the following settings. Create a gradient from the top of the rectangle to about halfway down as shown.

image 5

Step 6 - Opacity Settings

Move the layer 1px from the top of the rectangle by pressing the down arrow on your keyboard one time.. Lower the opacity to 20% in the layer panel as shown.

image 6

Step 7 - Another Gradient

Create a new layer and select the gradient tool with these settings. Create a gradient like in step 6 but this time go from the middle to the top.

image 7

Step 8 - Gradient Blend

To blend this gradient, set the layer mode to Overlay and lower the opacity to 15% in the layer panel as shown in this screenshot.

image 8

Step 9 - Add Your Text

Select the horizontal type tool (T) and type the text you want in white on the button. Set the text layer mode to Overlay and your done, here's how mine turned out:

Professional Forum Buttons Tutorial: Final Result



Author's URL: imgry.com

Rate this Material: Bad 1 2 3 4 5 Excellent
print this page tell a friend subscribe to newsletter subscribe to rss

Add comments to "Professional Forum Buttons"