Iconify is the most versatile icon framework. It was originally designed to replace outdated icon fonts with modern SVG framework, while offering ease of use that icon fonts are famous for. Since then Iconify has evolved. It offers more icons than any other solution and various native components for web app frameworks.
This documentation is split into several parts.
There is no standard for designing or publishing icons. Each icon set is different. Some use stroke for colors, some use fill, some use hardcoded palette. Usually icons contain a lot of unnecessary code. Every icon set has its own way of using icons.
Iconify attempts to streamline that, by parsing icons and converting them to the same easy to use format.
Iconify offers more than 100 open source icon sets with over 100,000 icons. All icons are pre-processed and stored informat.
See icons section for list of various packages and formats.
Browse icons to see what is available.
In addition to offering open source icon data as packages, Iconify has public API.
API is used to:
Having 100k+ icons is not really helpful without ability to use them in your projects.
There are various ways to use icons:
- Iconify icon components are available for most popular frameworks: Vue, React, Svelte, etc...
- Iconify SVG framework makes it easy to use icons in HTML without UI frameworks.
- Unplugin Icons dynamically generates icon components for many frameworks: Vue, React, Svelte, Solid, etc... and it works with all popular bundlers.
- UnoCSS with package allows you to use icons in a stylesheet.
- Astro Icon component for Astro.
Missing an icon component for UI framework of your choice or want to create your own icon component? See "Libraries" section below. Components listed above use functions from Iconify Utils to generate icons.
In addition to icon components, Icon Finder is in development.
In addition to icon data and components, Iconify offers plug-ins for popular software for UI design:
Libraries section contains documentation for various tools that are used to develop and maintain Iconify: