Create a Flash Web2.0 Icon in 10 Steps

Posted by Samy | Filed under Designing

This tutorial cover’s how to create a glossy looking icon in few minutes.

Step 1

Open photoshop > new file > using the Ellipse Tool creates a circle. > Center of the layout.

Step 2

While the circle is selected to go to layers (right side on this screen) > right click on the shape layer, Select blending option.

Step 3

Layer style window opens > under it > Apply Gradient Overlay Effect.

Step 4

We have to put original colors code of icon which I had already (Dark red. #961700 , Red #f60101,Light red #ffd4d4 ) to change it, go to > gradient > click on edit gradient > gradient editor > fill the right side color code to #961700 and left side to #ffd4d4. 20% from the right side , insert new “Color stop” > change color of it as #f60101, that’s it. We get the right color. Click “ok” for close the window. Now we will back on the layer style window > under it, there is “Style” > change the linear to be radial. Then select apply”Stork” > structure > change size to 3 > change color to. #fb7272 click ok for close this windows.



Step 5

Select Ellipse tool create oval shape . Align it to center top of a circle > make sure the color of circle should be white. While the circle is selected. Go to layers (right side on this screen) > right click on the shape layer.
Select blending option > layer style window opens > under it > apply gradient overlay effect.

Click Here! To Follow Instantly Accessible Online Photoshop Video Tutorials

Step 6

Under gradient > we have select colors, for that click on edit gradient > gradient editor > presets > select 2nd presets(Foreground to Transparent) >
click ok to close gradient editor window > layer style window is still open > gradient > under it angle > change it to -90 degree > then clicks ok to close.

Step 7

While the oval shape is selected under “Layer” > there is fill on top of it > make that 100%to 0 % .

Step 8

Create a shape of “F” using the Pen tool.

Step 9

After creating F shape > go to layer > while the shape is selected, right click on it . Select blending option > layer style window opens > under it > select stroke > stroke structure > size increase to 7 px > click ok to close it.

Step 10

Go to file menu > save as > name it > change the format to .png > and save it . That’s it.

Done.

Download file :-

http://www.isfx.org/icon/download/flashicon.zip

Permalink | February 14th, 2009

3 Responses to “Create a Flash Web2.0 Icon in 10 Steps”

  1. Michelle Says:
    March 16th, 2009 at 11:42 am

    Hi http://www.isfx.org! I bookmarked this guestbook. Thank you for good job!

  2. mohammed Says:
    June 29th, 2009 at 9:06 am

    thnx alot ma dear :D
    very beatiful :d

  3. mohammed Says:
    June 29th, 2009 at 9:08 am

    plz add me on ur mail :D

Leave a Reply