fbpx

High Quality Icons Library for Your Next Design Project (Free & Premium)

I’m a fan of icons. Some might argue that using icons is no longer a trend but for me it’s about staying in control of the medium and resources that you need for every design project. Icons undeniably still serve well in helping users navigate with ease. On top of that, it adds emotion to a digital product. Designers can express their style and how they want users to feel about their product through icons. In design, nothing really gets old if it’s used right.

Here are some rules of thumb when using icons:

  1. Avoid using icons as is. Even with the most stylistic set you should still modify them to fit your project or personal style.
  2. Consistency check. Always make sure the icon set you choose speaks the same language as your typography and graphic choices. Consider what the appropriate tone is. Minimal, simplified icons are adaptive to any design but sometimes may appear soulless. Stylistic and detailed icons used right will greatly enhance your design but in some cases they take more attention then they need to.
  3. Constantly ask how many do you actually need? And the answer is always less is more. Consider icon placement, visual balance and content density. An example of bad icon usage is when they are use for a long list of categories or buttons. The minute you have more than 5 icons to represent choices, users have a hard time figure out what they are or remembering them.
  4. Purpose. Always know what the particular functions of icons are in your project. Are they for navigation, decoration or branding? The function can be more than one for icons at a particular placement. However make sure you don’t use icons for more than one area with different purposes. Or in other words, don’t abuse them.
  5. Don’t just stick with free icons. Designers invest in fonts, it’s also worth it to invest in icons. A high quality icon set gives you more modification options and ease of use.

Icon Apps

These apps allow you to “drag an drop” icons onto your working project without having to go to your web browser and download. Also, they cut out the pain of having to search through files of icons.

NounPro from the Noun Project

This app gives you the most variety since the icons come from different designers. However, the monthly subscription of $9.99 won’t make much sense if you don’t use icons on a regular basis. If that is the case you can go with their original web version. It might be less efficient but as a free resources it’s still great.

1*ltX4GKnWYBGFhCo1uZDBlA

 

Smash Icons

Each icons in this set comes in solid, outline and detail color styles. Aside from UI, they can be constructed into infographics or small illustrations.
1*zOnQBXvq3WNMGsZhc3arSA

 

Icons8

I’m not crazy about the icon design and variation of this app for the price of $249, though with the free version, where you can only get png icons, this app is still awesome for design prototyping or keynote presentations.

1*ayePIk6VKia9LdY7EzbUNw

 

Icon Jar

This is not an icon library itself but a tool to organize all your icon resources which is extremely helpful.

1*vMza3Cl7rQWnE2y5Q8PzKg

 

Premium Sets

Most premium sets give you free example packs. The free samples are usually efficient enough to use for apps and webs. If you want to commit to one make sure you preview the entire set and evaluate:

 

1. When a pack says 5,000 icons, for example, how many are actually unique icons and how many are just slight modifications of the same icon.

2. What is the generic style of the pack, how many categories are included, how often can you use them?

3. How many file formats does it come with?

4. Does it get updated frequently if not at all?

 

Streamline Icons

 

NOVA

 

Swift Icons

A free set of 168 icons from this pack can be downloaded here.

1*CQzDcU9C5e8p97_-JlvVtw

 

The Ultimate Icon Bundle

 

Stylist Sets

These sets are not as versatile and can only be used for very specific design direction. I don’t see myself using them for UI a lot, though they can be applied to a wider range of projects from infographics and illustrations to animations.

 

Hand-drawn Icons

Remember those story-telling motion graphics with a hand doodling on paper as the story unfolds? This set might save you tons of time if sketching/drawing is not your special power.

 

Lil Stories — Weather Icons

This one is my favorite. It’s a small set with small price of $4. I’ve used them to build scenic illustrations for various projects.

 

Kameleon

Not a fan of their default google material color choice but with some modification this one still a good option for interactive design.

 

Sharpicons

 

Icon Fonts

I assume that everyone knows Font Awesome by now so I won’t mention it. If you are not familiar with icon fonts, read about it here. Here is a list of open source icon font libraries similar to Font Awesome.

 

Google Material

 

We Love Icon Fonts

 

Fontello

 

Fontastic

With this one you can turn your favorite icon set into an icon font.

And that’s all. I hope this helps!

Asif Khan