Vector icons can be an excellent tool for web designers or developers (without a knack for design) to indicate or highlight UI elements and solve responsive issues on retina displays (vectors are a mathematical representation of a design, allowing for an unlimited and loss-less ability to scale for any resolution/size). Below are some resources that I’ve found over the years — while most of these resources are free, be sure to check (and double check) the required license for each.

1. Smashing Magazine

Not only one of my favorite resources for web development and design reading, tips, and ideas — but a great resource for free icon sets! Licensed under Creative Commons Attribution 4.0 International License meaning that they’re absolutely FREE Icons to use and modify.

Link: https://www.smashingmagazine.com/2015/07/freebie-smashicons-icon-set/

2. Font Awesome Icons

Another great resource for svg web icons — include this in your next web project for fully rasterized, crisp, svg web icons. Click here to learn how to include these icons in your next web project (they’ve got a great CDN I recommend you use, especially if you’re on a shared host).

Link: https://fortawesome.github.io/Font-Awesome/

3. Glyphicons

If you’re familiar with Bootstrap, you’re familiar with Glyphicons. Glyphicons is a set of svg web icons to use in your next web project (via icon classes) — this can save a tremendous amount of time when it comes to indicators, helpers, etc.

Link: http://glyphicons.com/

4. Awwwards.com Collection

A compilation of both wireframe and color-rich svg web icons brought to you by awwwards.com!

Link: http://www.awwwards.com/great-collection-of-free-vector-icons-and-pictograms-for-interfaces-and-responsive-web-design.html

5. FLATICON

This may be one of the best compilations of flat icon designs I’ve found. The only issue with this resource is that not all of the icons will be free for commercial and personal use — some may require author attribution or license purchase (be sure to check the license requriements).

Link: http://www.flaticon.com/

Not sure what a license means?

Be sure to check out a previous article of ours explaining the different types of licenses and what to look out for.