It’s when I see the horrible mess that is iOS 7 that I truly learn to appreciate Android’s ability to let you customize the home screen yourself, including deciding how icons should look like. A lot of people use custom icons on their Android devices, and those that do, have probably encountered the same problem I have more than once: an icon pack you like don’t have any icons that fit a specific app or shortcut. When that happens, I normally turn to photo editing to make some additional icons. I’ve been asked about some of my own several times, so I thought I would share a few tips for making additional icons to go with an existing icon pack.

Note: This article is intended for amateurs like myself, not professional designers. It does assume basic knowledge of editing and creating icons on the side of the reader, and is not a guide to creating icons from scratch. 

1. Use an existing icon from the pack as the starting point

Whenever I need to create a completely new icon from scratch, I always start by opening one of the existing icons in a photo editing program, rather than start from scratch. This allows me to see the resolution, as well as the size of the actual icon, which might have a bit of a margin on the sides. An icon can end up looking extremely weird next to others if it fills out the file when the other icons are centered, or vice versa.

2. Use existing images and icons to create your new one

Normally you shouldn’t run around the internet, copying images and using them in your own creations, but for strictly personally use, it won’t kill anyone. If I for instance need an icon of a shopping cart, I don’t draw a shopping cart from scratch, but rather find an icon of one that I adapt to fit the dimensions, style and color schemes of the other icons I have. I’ve also made new icons by combining two icons, and by removing parts of an icon and scaling the rest.

3. Gradients, textures, and colors are often easier to copy than to replicate

paste-intoI use a fairly large icon pack as the basis for all my icons, and add icons to that as needed. The existing icons use a gray gradient that I have no clue how to replicate exactly from scratch, so I don’t. Instead, I find an existing icon that has a lot of surface area, copy it, and use it to fill out my new icon. For the shopping cart example above, I would find an icon with single color shopping cart, select it using a quick selection tool, and then paste another icon into that selection, and scale it until it covers everything. You could do the same for textures. For colors, using the color picker on an existing icon always works better than trying to guess the color.

4. For detailed icons, use a higher resolution

Professional designers would likely kill me for not working with high resolution images and vector graphics, but for just personal use, I tend to not worry too much about making icons compatible with future high resolution screens and whatnot. The only time I intentionally work in higher resolutions than that of the icons I’m adding to is when the icon has a lot of detail. Selection tools and similar tools generally work better when selecting higher resolution pieces, so I find it better to scale everything down afterwards if I need to use those.

5. Transparency is often better than fill colors

This one is perhaps obvious, but I’ll say it anyways: using a file format that supports transparency (such as PNG) and keeping parts of an icon transparent are normally better choices than trying to fill in icons with the background color where they’re going to be used. That allows the background color to shine through, making it easier to keep it consistent.

Result

Below is my Tasker-made quick access sidebar. 5 of the icons shown (not counting each more than once) have been fabricated by me, the rest are from the icon pack I use.

custom-icons