Quality is one of the most important criteria points used for approving icons and illustrations. We hold all our contributors to very high standards, and will deny sets that fall into the common pitfalls below:

1. Lack of refinement or style

You need to take into account that icons and illustrations should be designed with the idea that they will be used in different sizes and instances so making them recognizable is one of the key things. It’s important to set a style that you want to go with from the start (rounded corners, certain line cuts, colors...) and try and stick with them within the set. Refinement is also important so please spend time and refine details of the items by making sure that lines/elements are not clashing, forming shapes are nicely spaced and everything looks well constructed.

In the above example you can see that there is a lack of refinement and no set style within the set. The use of different background colors does not help.

In the above example you can see how refinement and style can define a set.

In the case of illustrations, the quality difference is very apparent in some cases, even more than with icons.

Since illustrations often portray people, it is very important that they have personality and are relatable. The illustration on the left is beautifully drawn and many of us can identify with it. On the contrary, the illustration on the right needs more work - right now, it does not have personality and the drawing style is not refined. The illustration on the left needs more work on its shapes, colours and effects.

The illustration on the left is beautifully drawn, has a great choice of colours and gives a good energy. The one on the right has been traced from a real photo and that is apparent. It again lacks personality and refinement, resulting in a low quality design.

2. Alignment issues

Keeping things clean and in a nice order is not what makes an icon or an illustration great by default but it can hurt it for sure when things are rushed. Elements should be aligned consistently between themselves and within the artboard. You can read more about alignment and artboards here.

In the above examples you can see how elements are not aligned within the icon (left) and one example where the icon is not aligned within the artboard (right).

3. Style Conversions

Looking for shortcuts and way to cut down the time needed to design icons (or illustrations) is a natural thing but should be avoided when it affects the quality. Conversions from a style to another style is, in many cases, a trap and can result in poor quality artwork if no extra care and attention is taken.

The most common direct style conversion is from outline to glyph. For example, when one designs glyph icons, the solid shapes are used to define areas of light and shadow without relying on lines. In the case of outline, using lines to define a shape uses a completely different approach: rather than using light and shadow to define the edges of an object, the edges of the object are outlined without regard to light and shadow. The two approaches are mutually-exclusive and converting an outline icon directly to glyph, without any adaptation, doesn't look good.

In the above examples, you see a good example of line to glyph conversion and a bad example too. Simple conversion from outline to glyph is not working on all icons so you should take extra care and make sure they are recognizable.

4. Text and icons

While in some cases this makes sense, you should normally avoid using text on icons. Only use if it is truly integral to the icon and its understanding. If you really do need to use text, then make sure it matches the style of the icons. It's also important to note that by using text, you’re essentially blocking usage from those who don’t speak the same language as the text, which might limit the icon’s popularity. Icons, by definition, should be universal and understood - and using text restricts their usability potential.

Text and illustrations

It is also advisable to avoid using text on illustrations, as they should be speaking by themselves, without the need for words. However, if you need to add text, make sure that the text font and styling fits the illustration drawing style.

The illustration on the right might look better without the text - ideally, it would represent the message without words. The illustration on the left has a more justified use of the text to represent the different languages and the style of the text matches the design style well.

5. Inconsistency

A lot of times you might try to bring variety to your set but, without realizing, you end up with an inconsistent set. Consistency is an important thing to keep in check while designing your icons. Make sure you are using line weights, colors, shapes in a consistent way through the icon set. You can read more about Consistency.

In the above example there is a lack of consistency in style, wrongly using almost all styles (outline, glyph, flat). This makes the icon set unmemorable and hard to use on a project where consistency is essential.

In the above example you can see a consistent design style which makes the icons original and memorable.

Below is an example of a consistent illustration set. The drawing style is shared among all illustrations, together with the limited colour palette (of green, yellow and pink).

6. Obsolescence

It’s important to think about the future of your icon or illustration, and how they may age over time. Try to create concepts and designs that won't easily become outdated or irrelevant. Generally, avoid attaching elements that depict specific dates. Stay away from symbols that may quickly become antiquated. In certain instances timeliness can be profitable in the short term, but it’s normally wise to ask yourself “Would I still want to buy this in 5 years?”. It’s important to remember that icons or illustrations which haven’t been downloaded in a certain number of years run the risk of being hidden from search results.

Learn more:

To get an idea of what we consider as high-quality icons, you can check the Featured icon sets and the work of Top selling designers and use these as reference.

To understand what we consider as high-quality illustrations, check our illustration section.

In addition, here is a list of resources to help you improve the quality of your icons:

Five easy steps for better icon design

Google material design guidelines

A complete guide to iconography

Downloadable Icon & UI templates

Icons for user interfaces

Icons, symbols & pictograms - technical information

Free icon design guide

Drawing an icon set

Remember to check out all our Criteria for approving icons and illustrations.

Did this answer your question?