In this photoshop tutorial, we will make a cool looking glossy contact us icon. Tutorial is easy, just follow the steps carefully.

Preview of final icon:

Step 1:
Create a new document, roughly about 400 px by 400 pixels, with white background. Create a new layer and set color to #ed870f. Select “Rounded rectangle tool” and radius 8px draw a rounded square shape.


Apply following layer style to this round shape layer.

Step 2:
Press and hold CTRL key and click on round shape layer. This will load the button shape.


Drag the selection below the button.


Create a new layer. Set foreground color to #dc4801 Select gradient tool with “Foreground To Transparent”. Press and hold SHIFT key and drag mouse from top of selection to middle of selection.


Press CTRL+D to de-select selection.

Step 3:
Create a new layer. Set foreground color to white. Select a soft brush of radius 200px and set opacity to 60%. Click once on top of the button as shown below.


Change layer mode to “overlay”.

Create a duplicate of this layer and set layer mode to “Normal”. Press CTRL+T and contract the shape like this:


Our button looks like this now:


Step 4:
Create a new layer and select “Rounded rectangle tool” with 5px radius. Draw a shape as shown below in white color.


And apply following layer style.




Button should now look like this:

Step 5:
Create a new layer. Select “polygon Tool”


and set number of slides to 3. Set color to #e9e9e9 and draw a shape as shown below.


Press CTRL+T to resize the shape.
Apply following layer style to this shape.






It should now look like this:


Repeat same process and create another triangular shape with same layer style as shown below.

That’s it, our contact icon is ready. This is how final contact us icon looks on a white background.


And this is on transparent background.


License:
Free for personal and commercial use. If possible, please link back to our site as source.

I hope you like the tutorial. below you can download PSD file.

After free RSS icons, I have another freebie for my readers, Twitter Birds.



If you use these free twitter bird logo, or put it for free on your website, please link back to our website as source. These icons are free to use for personal and commercial use.
Download Free twitter Bird icons set

I just made few RSS icons. Icons are in PNG format and of size 128px X 128px You are free to use these icons for personal and commercial use.

Preview Of RSS icons:

If you use these free icons, or put it for free on your website, please link back to our website as source of the icon.
Download Free RSS icons set

In this tutorial we will learn how to make a shiny web 2.0 type chat icon in photoshop.

1) Create a new decument (File -> New), size 400 X 400 px and transparent background.

2) To create chat icon, select following:

• Select text tool from tool palette.
• Font type Webdings
• Size 250 px
• color on your choise, I have taken red color.

And type  ^
We will get a chat icon like this:

3) Right Click on layer and select “Blending Options” and do following settings.

5) Hold Ctrl key and click on the layer in the layer pallet to select all contents of this layer.

6) Creat a new layer (layer -> New Layer)

7) Select “rectangular marquee tool”

Now, hold Alt key and draw a shape like this:

Fill up the selection with white color using the “Paint Bucket Tool”.

9) Set the layer blend mode to Soft Light, opacity to 75%, and fill to 50%

Our chat icon is ready.

You can add some text and change color of icon of your choise.