How to Create Icons: It’s Easier Than You Might Think!

PDF download Download Article

Follow this guide to create a custom icon

PDF download Download Article

Customizing your icons is a great way to add personality to your desktop! Make your computer feel more “you” with the help of an editing software. This tutorial uses GIMP, but any layer-based photo editor will work. This wikiHow article will show you how to create icons for Windows or Mac.

Things You Should Know

  • Find or design a base image for your icon. It should be a square image around 256 x 256 pixels (px) on Windows or 512 x 512 px on Mac.
  • Open the image in your photo editing software. Then, remove the background, add a transparency layer, and customize the icon until you get the look you’re going for.
  • This guide just covers icon creation and exporting to .ico (the Windows icon file format). See our guides on changing icons on Windows and Mac OS X for additional information.
Part 1
Part 1 of 2:

Editing the Image

PDF download Download Article
  1. You can use any image file to create an icon, but it should have a resolution of at least 256 x 256 px. This will allow it to scale well between all the different icon sizes. It doesn't matter if the image contains things you don't want to include in the final icon; you’ll be erasing everything you don't want to keep!
    • You can create your own images from scratch using your favorite drawing software or you can use any photo, drawing, or other image file.
    • Icons are square, so your image should fit well into a square. If it’s too long, the icon will likely look squished.
    • If you are creating Mac OS X icons, 512 x 512 may look better.
  2. In order to create an icon file, you might want to use a more powerful program than MS Paint. You can use Photoshop or a free image editor. Try GIMP, Adobe Express, or Pixlr for a free editing experience.
    • This guide uses GIMP , since it’s free on all operating systems. The process is very similar in Photoshop and Pixlr.
    Advertisement
  3. Open the downloaded or created image using GIMP. The image will appear in a window in the middle of your screen.
  4. The alpha channel is a layer of transparency. This will allow the icon to have a transparent background when you erase the parts of the image you don't want. To add an alpha channel, right-click on the layer in the Layers window on the right side of the screen. Select "Add Alpha Channel".
  5. The Quick Mask will allow you to easily get rid of the parts of the image you don't want to keep. To insert the Quick Mask, press ⇧ Shift + Q . A red layer will appear over the image.
    • Quick Mask allows you to select part of an image. You can use a different selection tool if you prefer!
  6. Select the Eraser tool from the Toolbox window on the left side of the screen. Use the tool to erase the red layer over the part of the image you want to keep.
    • For example, if you have an image of a phone lying on a table and want to use the phone as the icon, erase the red layer from the phone only.
    • Use the Tool Options tab in the Toolbox window to adjust your eraser size. You can also zoom in to ensure that you erase exactly what you want.
    • When you erase the mask, you will only be removing the mask, not the image beneath it.
  7. Once you are finished clearing the mask off of the part you want to keep, press ⇧ Shift + Q again to toggle off the mask view. The part of the image that you erased will be selected.
  8. Press Ctrl + I or go to Select → Invert. This will select everything in the image except the part you erased the mask off of. Press Del to delete the selection, leaving just the subject of your icon.
    9. Advertisement
Part 2
Part 2 of 2:

Creating an Icon

PDF download Download Article
  1. Click Image → Canvas Size. In the window that appears, click the chain icon to unlink the width and the height. Change the canvas size to a size that shows the subject well, and ensure that both width and height are set to the same number.
    • Use the Offset values to center the image in your new canvas before clicking the Resize button.
    • Once you've resized the image, right-click on the layer and select "Layer to Image Size". This will change the layer boundary to match the canvas size.
  2. If you want, you can use GIMP's color tools to change the coloration of the image. The easiest way to do this is to click Color → Colorize and then adjust the settings until you find the color you feel looks best.
  3. The final step in creating an icon is ensuring that the image supports all the different icon sizes. This is essential if you want to be able to use the icon in different areas of the operating system and want them to scale when icon size is increased or decreased.
    • Duplicate the layer 5 times. Right-click the original layer in the Layers window and select Duplicate Layer . Repeat this until you have 4 copies of the original layer, 5 layers total.
    • Scale the original layer. Right-click the layer and select Scale Layer . Change the image scale to 256 X 256 px. Then click Image → Fit Canvas to Layers. (Note: if you are creating the icon set for OS X, start with a 512 X 512).
    • Scale the 4 copied layers to the following sizes:
      • 128 X 128
      • 48 X 48
      • 32 X 32
      • 16 X 16
  4. You should have 5 layers, each one with an image smaller than the last. If any of them look blurry, open the Sharpening Tool by clicking Filters → Enhance → Sharpen. Adjust the slider until the image is clearer.
  5. Click File → Export As . In the Export Image window, change the extension in the top field to ".ico" and choose a location to save the icon. A window will appear, asking if you want to compress any of the layers. Check the box to compress the two biggest layers, unless you are using Windows XP.
  6. Once you've exported the image into .ico format, you can use it to replace the icon for any file or folder you'd like.
    7. Advertisement

Community Q&A

Search
Add New Question
  • Question
    How do I get the Twitter icon to appear on the homepage of my iPhone?
    Community Answer
    If you mean by moving the app around, then hold your finger on the app until all apps start shaking. Then you can move it where you'd like. If you want to move it to another page, just hold it on the side of the phone that is the direction of the page that you'd like to go to. Press the home button once you've gotten the app where you would like it.
    Thanks! We're glad this was helpful.
    Thank you for your feedback.
    If wikiHow has helped you, please consider a small contribution to support us in helping more readers like you. We’re committed to providing the world with free how-to resources, and even $1 helps us in our mission. Support wikiHow
    Yes No
    Not Helpful 5 Helpful 3
  • Question
    How can I download or make little icons to send in my texts without getting a virus or spyware?
    Community Answer
    The most reliable image source is yourself. You can also go to image searching websites such as Google Images or Yahoo Images, and then hold your finger on the image and tap Save Image. If there's any real danger included your phone or device will recognize it.
    Thanks! We're glad this was helpful.
    Thank you for your feedback.
    If wikiHow has helped you, please consider a small contribution to support us in helping more readers like you. We’re committed to providing the world with free how-to resources, and even $1 helps us in our mission. Support wikiHow
    Yes No
    Not Helpful 3 Helpful 3
  • Question
    How can I draw an icon for a webpage? In what format should I save it?
    Community Answer
    You can draw icons using Adobe Flash or even on MS Paint if you are good in it. The common formats supported for web pages are ".jpeg" and ".png," and you can also make animation using Adobe Photoshop Imageready in ".gif" format for your website.
    Thanks! We're glad this was helpful.
    Thank you for your feedback.
    If wikiHow has helped you, please consider a small contribution to support us in helping more readers like you. We’re committed to providing the world with free how-to resources, and even $1 helps us in our mission. Support wikiHow
    Yes No
    Not Helpful 1 Helpful 3
Ask a Question
200 characters left
Include your email address to get a message when this question is answered.
Submit
      Advertisement

      Video

      Tips

      Submit a Tip
      All tip submissions are carefully reviewed before being published
      Name
      Please provide your name and last initial
      Submit
      Thanks for submitting a tip for review!

      You Might Also Like

      How to
      Use an Image or Drawing as an Windows Icon
      How to
      Make a Fake ID
      Use Your Keyboard to Type Symbols: Alt Key + More
      The Ultimate Guide: How to Show Symbols, Accents & Emojis on a Mac
      How to
      Type a Less Than or Equal to Sign: PC & Mac
      2 Easy Ways to Type a Symbol on a Laptop Keyboard
      4 Simple Ways to Find the DPI of an Image on a Computer
      How to
      Open and View DWG Files (on Windows, Mac, & More)
      How to
      Text a Heart <3 Using Symbols Instead of Emoji
      How to
      Hide Icon Names on a Desktop (Windows and MacOS)
      How to
      Make a Cat Using Your Keyboard
      How to
      Create Subscript in Microsoft Office, Google Docs, & TextEdit
      Simple Ways to Find the Hex Code of Any Color on Your Computer
      How to
      Add Words to Images on Windows, Mac, iPhone, and Android
      Advertisement

      About This Article

      Article Summary X

      To create an icon, first download an image editing program, such as GIMP or Photoshop, to alter the image you want to use. Once you open the program, you’ll need to add an alpha channel, which will allow your image to have a transparent background. Then, you should apply a quick mask and use the eraser tool to color in the part of the image you want to keep. For example, if you’re making an icon of a cell phone, you would erase the cell phone part. After using the eraser tool, you can delete the background layer, leaving just the image you want with a transparent background. Finally, export the image into .ico format. Then, simply go to the settings on your computer to assign your new icon! To learn how to adjust the color of your icon, read on!

      Did this summary help you?
      In other languages
      Thanks to all authors for creating a page that has been read 510,267 times.

      Is this article up to date?

      Advertisement