Free SVG Icon Set For Your Website — Feather Icons

Lately, my agent has been placing random icons or magnifying glasses throughout my websites. While I usually ignored these issues, it began to get annoying. Therefore, I was looking for a decent icon library that allows agents to place the right icon.

Feather is a set of almost 300 icons built on a 24x24 pixel grid with consistent line art. It includes all the icons you might need for your next web project like arrows, home, user, settings, search, camera, bell, heart, shopping cart, mail, lock, phone, and many more. All icons are available under the MIT license. This means that you don’t have to worry about attribution, even if you use the icons in commercial projects.

The easiest way to include Feather icons into any web project is by using the unpkg CDN. There is nothing to install and no registration required. Just add one <script> tag and you can use any icon by its name via a data attribute. The agent does not have to worry about files or downloads. It only has to know the icon name from feathericons.com.

1How to use Feather Icons in your project

<script src="https://unpkg.com/feather-icons"></script>

<i data-feather="circle"></i>

<script>
  feather.replace();
</script>

Done! Just copy paste the above code snippet into your agent and tell him/her to look up the correct icon name on feathericons.com and use the same pattern to include the icons into your website. The agent will take care of the rest. All icons inherit your CSS colors and sizes to match your design.