There are so many beautiful icon out there. You can download it for free. But, design your own icon is always a challenge. In this tutorial, we will learn how to create a glossy icon using Photoshop. This is a very simple tutorial, you can finish this in 10 or 15 minutes. First, take a look at the icon we’ll be creating here.
Create a new file, size 512×512 pixel, color mode RGB, with white background. From panel layers, create new group and name it icon. This way, our icon will be easily organized.
Activate Rounded Rectangle tool. From option bar set radius to 30 px. Hold shift and drag to create a rectangle. You can use any color because we will change it from layer styles.
Double click our new shape layer and add some layer styles. Use settings shown below.
While gradient overlay is selected, click and drag to upper part of the rectangle to move the light source.
Hold ctrl and click the shape layer.
Hold shift+alt and using ellips marquee tool create another selection on top.
Both selection with intersect and create this shape.
Create new layer. Activate gradient tool. Add a white to black gradient.
Change layer’s blending mode to Screen and opacity to 60%.
Copy paste logo you want to add. I use the logo from my favorite site 1stwebdesigner.
Press D to change foreground color to black. Using pen tool, trace the logo manually.
After finish with the logo, we can hide the reference logo by clicking on its eye icon.
Again, we need to add some layer styles to the logo. Use setting below.
Last step is change knockout to Deep and move the black slider underneath it. This wil put a hole that allow us to see right into the Background layer.
Below is our final icon.
I give some colors to the Background to assure you that our logo is really creating a hole.
I hope you like this simple tutorial. If you have any idea on creating icon, please feel free to write a comment below.