Home
Photoshop
Web Layout
Creating a Button
Level: Beginner Software:
Photoshop
1) Let's open up a new image, 88x31. Your foreground color should be #0079C5 and background color should be white. Now, create a new layer by going to Layer>New>Layer and make sure the background is white, not transparent (Otherwise, the following steps will not work) .
2) Select the Elliptical Marquee Tool and create a small circle in the center (Hold Shift to make a perfect circle) . You should have something like this:
3) Next go to Filter>Stylize>Extrude...
...and use these settings:
4) Now, go to Filter>Blur>Motion Blur and apply the following settings:
5) Last filter to apply and it's a neon glow! So, go to Filter>Artistic>Neon Glow and use these settings:
Make sure the Glow Color is set to #00688F or it'll look gay.
6) Here, we will make a text background. Ok, now make a new layer by
going to Layer>New>Layer and select your foreground color
(#0079C5) . Select the Rectangular Marquee Tool and make a selection at
the bottom and fill it with the foreground color (Alt+BackSpace) . You
should get something like this:
7) On the same layer, go to the Layers Palette (Windows>Layers) ,
select the text background layer. Change the opacity to 80% and the
fill to 90%.
8) Create a new layer and select your pencil tool. Make sure the brush
size is 1px and the color black. Holding Shift, draw a line on top of
the text bg. Should look like this:
9) Time to make the text. Select a good pixel font and make your text. After you position your text and all, go to the
Layers Palette and right-click to select Blending Options. Select
Stroke and use these settings:
You should have completed this tutorial and made a nice still button. For reference, here is my final copy:
You can take this tutorial one step further and animate it. Learn Here!
More Photoshop: Most Popular Materials | Fresh Materials
| TutorialKit New Photoshop Tutorials