An open source icon set with marks in SVG, sprite, webfont and raster format


2051.1.1-alpha.32 years ago4 years agoMinified + gzip package size for @icon/open-iconic in KB



npm version

This repository is a module of the full standard-icons repository.


This repository is distributed with npm. After installing npm, you can install @icon/open-iconic with this command.

npm install --save @icon/open-iconic


There are many ways/formats of how to use open-iconic. The fastest and recommended way is via SVG directly. Or use the webfont version if you want to include all icons at once:

SVG icons -- when you need just a few icons in your project

1 . If you want to use just a few icons. Find the icons you need in "icons" folder. Then use them as regular images:

<img height="32" width="32" src="@icon/open-iconic/icons/account-login.svg" />

2 . Icons can be served from a CDN such as Unpkg. Simply use the @icon/open-iconic npm package in the URL like the following:

<img height="32" width="32" src="https://unpkg.com/@icon/open-iconic/icons/account-login.svg" />

Icons font -- ideal when you want to include all icons at once

1 . Install @icon/open-iconic with this command. In the <head> of your html, reference the location to your open-iconic.css.

<link rel="stylesheet" href="@icon/open-iconic/open-iconic.css">

2 . Use unpkg.com to load directly open-iconic without installing anything:

<link rel="stylesheet" href="https://unpkg.com/@icon/open-iconic/open-iconic.css">

Place open-iconic with <i> tag in your html like this. Icon class names are to be used with the oi class prefix.

<i class="oi oi-account-login"></i>

Bugs, Ideas, Pull Requests

If you have any ideas or found bugs, please send me Pull Requests or let me know with GitHub Issues.


Open-iconic is copyright by Iconic, licensed under the MIT.

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.