Individual icon sets
There are several packages available that contain all icons, see icon sets documentation.
This article describes individual icons packages.
Packages
Each icon set is available as a separate NPM package. Package name is @iconify-json/{prefix}, where "{prefix}" is icon set prefix.
These packages are available only on NPM. They are automatically generated from big icon sets package whenever it is updated.
Contents
Each package contains one icon set, split in several files:
- icons.json contains icon set in IconifyJSON format, without any metadata.
- info.json contains icon set information in IconifyInfo format.
- chars.json contains characters map, if exists in IconifyChars format. File might not exist in some icon sets.
- metadata.json contains metadata in IconifyMetaData format: categories, themes. File might not exist in some icon sets.
You can import icon set using named import from package, like this:
import { icons as mdiIcons } from '@iconify-json/mdi';
import { icons as mdiLightIcons } from '@iconify-json/mdi-light';
However, code above uses JSON modules. It works fine when using bundlers or when using CommonJS. When using ES modules, importing JSON files requires running script with "--experimental-json-modules" flag.
Alternative is to use require():
const mdiIcons = require('@iconify-json/mdi/icons.json');
const mdiLightIcons = require('@iconify-json/mdi-light/icons.json');
Creating packages
If you want to create a package for your icon set, see exportJSONPackage() of Iconify Tools.
Difference from big icon sets package
In big icon sets package, all JSON files contain an entire icon set: icon data, information, metadata (categories, themes), characters map.
In small packages that data is split into several files, as described above. If you only want icon data, it is better to read icons.json from multiple small packages because they are smaller.
Collections list
Small packages contain only one icon set. How to know which icon sets are available?
List of icon sets is available in @iconify/collections package.
Package contains collections.json with list of all icon sets, same as collections.json in @iconify/json package.
You can import collections list directly from @iconify/collections/collections.json as default import or use named import:
import { collections } from '@iconify/collections';
Reading data
For reading icon sets, you can use:
- Iconify Utils for JavaScript.
- Iconify JSON Tools for PHP (also available for JavaScript, but deprecated).