Grasp the chance to enhance your site with the best fitting layout, including elements like buttons, headers and logos.  Home Photoshop Web Layout Create a Get Firefox Button

Create a Get Firefox Button


Open a new document (300px x 300px) and fill the background with white.

Create now a new layer and with the "Rounded Rectangle Tool" ( image 1 ) draw a rectangle 145 px x 30 px.

Open the blending option panel for this layer and set:

image 2

image 3

image 4

Create a new level and set the zoom of the page at 300%

With the eyedropper tool pick the color of the edge of the rectangle and with the "Pencil Tool" ( image 5 ) using a 1px brush draw a little vertical line inside the button.

image 6

Right, our button is now finished, I've personalized it in this way:

image 7

Create a new layer and import the Firefox icon on the stage, resize it (Ctrl-T) and set the opacity to 60%

image 8

Now get the text tool and type in "Get Firefox" (I've used Amazon font)

Open the blending options panel and set:

image 9

image 10

image 11

Here is the result:

image 12

Create now a new layer and get the "Shape Tool", select an arrow shape

image 13

and draw it on the stage (rotate it if needed), then open the blending option panel and set:

image 14

image 15

image 16

Finished! Your "Get Firefox" button is ready to use.

Create a Button Tutorial: Final Result



Author's URL: Tutorialweb
Thank you for voting.
Rate this Materials:
Bad 
1 2 3 4 5 Excellent
print this page subscribe to newsletter subscribe to rss

Advance your current skills or acquire new skills in Photoshop by creating projects using our step-by-step tutorials. More Tutorials: Most Popular Materials | Fresh Materials | TutorialKit New Photoshop Tutorials

Add comments to "Create a Get Firefox Button"

Only registered users can write comment

No comments yet...