How to Make Windows Icons in Photoshop
Although there is no shortage of free icons on the Internet, you may discover that none of them fit your purposes. Perhaps you want to make specialized icons from your own images for use on your desktop, or you need a completely original look for buttons on your website. Photoshop allows you to create icons. Not only is it relatively easy to create icons in Photoshop, it's also addictive. Once you're able to create your first icon, you'll be tempted to create an entire icon suite.
Instructions
-
- 1
-
2
Select the Rectangle Marquee Tool from the toolbar, or press "M" on your keyboard. Draw a rectangle. Select the foreground paint color in the toolbar, and change color to gray (#C8C8C6). Select the Fill Tool from the toolbar, and click inside the rectangle to fill it with the gray color.
-
- 3
-
4
Create another layer, and make five more rectangles down the middle of the black rectangle. In the Marquee toolbar (located under the Menu bar), make sure the "Addition" icon is selected. There will also be a plus symbol connected to the drawing arrow. The addition marquee allows you to create multiple rectangles on one layer. Change the foreground paint color to gray (#AAACA3) and fill four rectangles with this color. Next, change the foreground paint color to white, and fill in the one remaining rectangle with white.
- 5
-
6
Duplicate this layer by right-clicking on it, and selecting "Duplicate Layer." Go to Edit on the menu bar and select "Transform," then "Scale." In the Scale toolbar, lower the percentage of the width and height. It will start at 100 percent. In this example, the percentage was changed to 77 percent.
-
7
Create a new layer. Select the ellipse tool from the toolbar, or by pressing "U" on your keyboard. In the Shape toolbar under the menu bar, be sure to select the rectangle shape and enter in "10 px" as the radius. Draw a small button shaped rectangle over the larger, white rectangle. Change the foreground paint color to black. To fill in the color, double-click the shape in the color in the layer box, and change fill to black. Repeat the process, creating two rounded rectangles side by side.
- 8
-
9
Select the ellipse tool again, but this time select the circle tool. Hold the Shift key on your keyboard and draw a circle (the shift key keeps the circle perfectly round.) Change the foreground paint color to red and fill in the circle. Right-click on the layer, and select "Blending Options." Select Inner Shadow. Change the presets to 41 percent, and select "Cove Deep" as the Quality Contour. Under Inner Glow, change the Overlay to 75 percent and the color to white.
-
10
Return to Layer 1 (the original gray rectangle), and right-click. Select "Blending Options." Check "Inner Shadow," and change the angle to -122. Change opacity to 49 percent. Go to Bevel and Emboss, and change the Quality Contour to "Rolling Shape Descending" with a -51 degree angle. Under shading, change the altitude to 30 degrees.
-
11
Go to layer 3 (the layer containing the five smaller rectangles), and go to "Blending Options." Change the Inner Shadow to a 90 degree angle and select the "Cone" shape in Quality Contour. Uncheck "Use Global Light."
-
12
Create a new layer and move this layer under all the other layers. Select the paint brush from the toolbar. Using the hard round brush at 8px, draw a cord.
-
13
Right-click on the layer and select "Blending Options." Click "Bevel and Emboss," and then "Contour." Leave presets untouched.
-
14
Save for the web as a PNG-24. Keep the transparency option checked. You're done!
- 15
- 16
- 17
- 18
- 19
Tips & Warnings
Always work with true squares for icons.
To save as a desktop icon, change the file extension from .png to .ico.
Be patient with yourself. Photoshop requires a lot of time, and an acquaintance with the Ctrl + Z keys, which is the undo shortcut.