» Blog Archive » Awesome Looking Email Icon

Awesome Looking Email Icon

Posted by Samy | Filed under Designing

Icons are very small but important part for our web design. Today I am going to show you how to create an Email Icon in few steps. This is quick and fast move to create an email icon. Using pen tool, blending option, blur effect etc.. We can get an awesome email icon.

Step 1

Open a New file with 500×500 px with black color on background.

Step 2

Take a Guide Lines for height and width, then click on rectangle tool. Draw rectangle shape with light gray color.

Step 3

Change the foreground color to #b0b0b0. Then click on pen tool under tools panel. Draw triangle shape as shown. Same like this we need to create other parts using pen tool. (Remember we need to create all shapes cut to cut. There should no space between one another. You can align it after created all 3 shapes .Using Direct Selection Tool you can align it)

Step 4

Select 1st shape. Change color of it to #e3e3e3 .To do that, go to layer > change layer content > solid color > set it to #e3e3e3 .Now we need to give inner glow effect to a shape, to do that go to layer panel > right click on selected shape > click on blending options. Blending option opens>under it > check on inner glow > change blend mode screen to normal > change color to #dadada. Under elements > increase size to 10 .Then click OK .

Step 5

Our next step is, to show an envelop is opened .To do that, create a triangle shape using pen tool as shown. Next need to give gradient effect to that shape. To do that , right click on layer > select blending options.> Layer style panel > check ON gradient overlay > change gradient color > click on left color stop and change the color to #b0afaf then click on right side color stop and change the color to #d2d2d2 .Then click on OK to close both windows.

Step 6

Next we need to give more realistic look. For that we need to copy layer style of open flap triangle layer. Then go to rectangle shape (which we created at start) and right click on it then paste layer style .After that double click on gradient overlay effect. Change angle 90 to 180.and press OK.

Now you can remove grid lines from file.
its done

OR
FOR SLIGHTLY OPEN

Step 5

Our next step is to show an envelop is slightly open .To do that, create a triangle shape using pen tool as shown. Make a duplicate layer of it. To do that > go to layer > duplicate layer..> Click ok.
Then we need to make a shadow effect. To do that, select one shape from that 2 shape which we just created (select a shape which we had created 1st don’t select duplicate layer which is upper)

Go to tools panel > select direct selection tool > select the point and pan down as shown.
Then we need to blur it, to do that, go to filter > blur > box blur > set the radius to 12 pixel. Then press ok.

Step 6

Now we just created shadow effect .But there is one problem. The problem is, that blurred shape. To see that problem change the background color black to white. And now you can see the blur shape is blurred outside from top area.
To remove it, click on rectangular marquee tool > select that blur layer > select it > and press Del.

Step 7

Now our envelop looks nice .But need to give more effect. we want to show a flap is opened slightly . Select that triangle shape layer .Right click on it > click on blending options > check gradient overlay > change gradient color > click on black color stop > change it black to white #ffffff.and change white color stop ,white to gray #dddddd.then press OK to close both windows .Change background color white to black again.