From 2aad6972647430985b44c1af28028a0a36030af8 Mon Sep 17 00:00:00 2001
From: Vjacheslav Trushkin <cyberalien@gmail.com>
Date: Fri, 29 May 2020 22:08:45 +0300
Subject: [PATCH] Implement icon providers (similar to namespaces)

---
 .../browser-tests/tests/10-fake-api-test.ts   |  70 +++--
 .../browser-tests/tests/10-finder-v1-test.ts  |   3 +
 .../browser-tests/tests/10-finder-v2-test.ts  |   3 +
 .../tests/20-renderer-v1-test.ts              |  16 +-
 .../tests/20-renderer-v2-test.ts              |  16 +-
 .../browser-tests/tests/20-scan-dom-test.ts   |   2 +-
 .../tests/21-scan-dom-api-test.ts             | 103 ++++---
 packages/browser-tests/tests/fake-api.ts      |  44 ++-
 packages/core/src/api/callbacks.ts            |  84 ++++--
 packages/core/src/api/config.ts               | 116 ++++----
 packages/core/src/api/index.ts                | 197 ++++++++-----
 packages/core/src/api/modules.ts              |  51 ++--
 packages/core/src/cache/storage.ts            |  13 +-
 packages/core/src/icon/list.ts                |  15 +-
 packages/core/src/icon/name.ts                |  42 ++-
 packages/core/src/icon/sort.ts                |  34 ++-
 packages/core/src/interfaces/api.ts           |   3 +-
 packages/core/src/interfaces/cache.ts         |   2 +-
 packages/core/src/storage/index.ts            |  43 ++-
 .../core/tests/10-basic/icon-name-test.ts     |  74 ++++-
 packages/core/tests/10-basic/storage-test.ts  |  12 +-
 .../core/tests/30-api/10-callbacks-test.ts    | 267 +++++++++++++++---
 packages/core/tests/30-api/10-modules-test.ts |  44 ++-
 packages/core/tests/30-api/20-loading-test.ts | 209 ++++++++------
 packages/core/tests/30-cache/10-basic-test.ts |   4 +
 .../core/tests/30-cache/20-loading-test.ts    |  82 +++++-
 .../core/tests/30-cache/30-saving-test.ts     |  45 ++-
 packages/core/tests/30-cache/fake_cache.ts    |   2 +-
 packages/iconify/src/iconify.ts               |  69 +++--
 packages/iconify/src/modules/api-jsonp.ts     |  20 +-
 packages/iconify/src/scan.ts                  |  54 ++--
 31 files changed, 1204 insertions(+), 535 deletions(-)

diff --git a/packages/browser-tests/tests/10-fake-api-test.ts b/packages/browser-tests/tests/10-fake-api-test.ts
index 4a1c4f6..283cd8d 100644
--- a/packages/browser-tests/tests/10-fake-api-test.ts
+++ b/packages/browser-tests/tests/10-fake-api-test.ts
@@ -2,14 +2,14 @@ import mocha from 'mocha';
 import chai from 'chai';
 import { FakeData, setFakeData, prepareQuery, sendQuery } from './fake-api';
 import { API } from '@iconify/core/lib/api/';
-import { setAPIModule } from '@iconify/core/lib/api/modules';
+import { setDefaultAPIModule } from '@iconify/core/lib/api/modules';
 import { setAPIConfig } from '@iconify/core/lib/api/config';
 import { coreModules } from '@iconify/core/lib/modules';
 
 const expect = chai.expect;
 
 // Set API
-setAPIModule({
+setDefaultAPIModule({
 	prepare: prepareQuery,
 	send: sendQuery,
 });
@@ -21,7 +21,8 @@ function nextPrefix(): string {
 }
 
 describe('Testing fake API', () => {
-	it('Loading results', done => {
+	it('Loading results', (done) => {
+		const provider = nextPrefix();
 		const prefix = nextPrefix();
 		const data: FakeData = {
 			icons: ['icon1', 'icon2'],
@@ -41,24 +42,26 @@ describe('Testing fake API', () => {
 				height: 24,
 			},
 		};
-		setAPIConfig(
-			{
-				resources: ['https://api1.local', 'https://api2.local'],
-			},
-			prefix
-		);
-		setFakeData(prefix, data);
+		setAPIConfig(provider, {
+			resources: ['https://api1.local', 'https://api2.local'],
+		});
+		setFakeData(provider, prefix, data);
 
 		// Attempt to load icons
 		API.loadIcons(
-			[prefix + ':icon1', prefix + ':icon2'],
+			[
+				provider + ':' + prefix + ':icon1',
+				provider + ':' + prefix + ':icon2',
+			],
 			(loaded, missing, pending) => {
 				expect(loaded).to.be.eql([
 					{
+						provider,
 						prefix,
 						name: 'icon1',
 					},
 					{
+						provider,
 						prefix,
 						name: 'icon2',
 					},
@@ -68,7 +71,8 @@ describe('Testing fake API', () => {
 		);
 	});
 
-	it('Loading results with delay', done => {
+	it('Loading results with delay', (done) => {
+		const provider = nextPrefix();
 		const prefix = nextPrefix();
 		const data: FakeData = {
 			icons: ['icon1', 'icon2'],
@@ -89,23 +93,22 @@ describe('Testing fake API', () => {
 				height: 24,
 			},
 		};
-		setAPIConfig(
-			{
-				resources: ['https://api1.local', 'https://api2.local'],
-			},
-			prefix
-		);
-		setFakeData(prefix, data);
+		setAPIConfig(provider, {
+			resources: ['https://api1.local', 'https://api2.local'],
+		});
+		setFakeData(provider, prefix, data);
 
 		// Attempt to load icons
 		const start = Date.now();
 		API.loadIcons(
 			[
 				{
+					provider,
 					prefix,
 					name: 'icon1',
 				},
 				{
+					provider,
 					prefix,
 					name: 'icon2',
 				},
@@ -113,10 +116,12 @@ describe('Testing fake API', () => {
 			(loaded, missing, pending) => {
 				expect(loaded).to.be.eql([
 					{
+						provider,
 						prefix,
 						name: 'icon1',
 					},
 					{
+						provider,
 						prefix,
 						name: 'icon2',
 					},
@@ -129,7 +134,8 @@ describe('Testing fake API', () => {
 		);
 	});
 
-	it('Loading partial results', done => {
+	it('Loading partial results', (done) => {
+		const provider = nextPrefix();
 		const prefix = nextPrefix();
 		const data: FakeData = {
 			icons: ['icon1'],
@@ -146,21 +152,21 @@ describe('Testing fake API', () => {
 				height: 24,
 			},
 		};
-		setAPIConfig(
-			{
-				resources: ['https://api1.local', 'https://api2.local'],
-				rotate: 20,
-				timeout: 100,
-				limit: 1,
-			},
-			prefix
-		);
-		setFakeData(prefix, data);
+		setAPIConfig(provider, {
+			resources: ['https://api1.local', 'https://api2.local'],
+			rotate: 20,
+			timeout: 100,
+			limit: 1,
+		});
+		setFakeData(provider, prefix, data);
 
 		// Attempt to load icons
 		let counter = 0;
 		API.loadIcons(
-			[prefix + ':icon1', prefix + ':icon2'],
+			[
+				provider + ':' + prefix + ':icon1',
+				provider + ':' + prefix + ':icon2',
+			],
 			(loaded, missing, pending) => {
 				try {
 					counter++;
@@ -169,12 +175,14 @@ describe('Testing fake API', () => {
 							// Loaded icon1
 							expect(loaded).to.be.eql([
 								{
+									provider,
 									prefix,
 									name: 'icon1',
 								},
 							]);
 							expect(pending).to.be.eql([
 								{
+									provider,
 									prefix,
 									name: 'icon2',
 								},
diff --git a/packages/browser-tests/tests/10-finder-v1-test.ts b/packages/browser-tests/tests/10-finder-v1-test.ts
index 7a4b201..1c60b85 100644
--- a/packages/browser-tests/tests/10-finder-v1-test.ts
+++ b/packages/browser-tests/tests/10-finder-v1-test.ts
@@ -46,6 +46,7 @@ describe('Testing legacy finder', () => {
 		// Test all icons
 		testIcon(
 			{
+				provider: '',
 				prefix: 'mdi',
 				name: 'home',
 			},
@@ -54,6 +55,7 @@ describe('Testing legacy finder', () => {
 
 		testIcon(
 			{
+				provider: '',
 				prefix: 'mdi',
 				name: 'account',
 			},
@@ -62,6 +64,7 @@ describe('Testing legacy finder', () => {
 
 		testIcon(
 			{
+				provider: '',
 				prefix: 'ic',
 				name: 'baseline-account',
 			},
diff --git a/packages/browser-tests/tests/10-finder-v2-test.ts b/packages/browser-tests/tests/10-finder-v2-test.ts
index 79f3acf..efa45a5 100644
--- a/packages/browser-tests/tests/10-finder-v2-test.ts
+++ b/packages/browser-tests/tests/10-finder-v2-test.ts
@@ -46,6 +46,7 @@ describe('Testing finder', () => {
 		// Test all icons
 		testIcon(
 			{
+				provider: '',
 				prefix: 'mdi',
 				name: 'home',
 			},
@@ -54,6 +55,7 @@ describe('Testing finder', () => {
 
 		testIcon(
 			{
+				provider: '',
 				prefix: 'mdi',
 				name: 'account',
 			},
@@ -62,6 +64,7 @@ describe('Testing finder', () => {
 
 		testIcon(
 			{
+				provider: '',
 				prefix: 'ic',
 				name: 'baseline-account',
 			},
diff --git a/packages/browser-tests/tests/20-renderer-v1-test.ts b/packages/browser-tests/tests/20-renderer-v1-test.ts
index 651034f..c2c2ac0 100644
--- a/packages/browser-tests/tests/20-renderer-v1-test.ts
+++ b/packages/browser-tests/tests/20-renderer-v1-test.ts
@@ -18,7 +18,7 @@ addFinder(iconifyFinder);
 
 describe('Testing legacy renderer', () => {
 	// Add mentioned icons to storage
-	const storage = getStorage('mdi');
+	const storage = getStorage('', 'mdi');
 	addIconSet(storage, {
 		prefix: 'mdi',
 		icons: {
@@ -82,6 +82,7 @@ describe('Testing legacy renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'account-cash',
 		});
@@ -124,6 +125,7 @@ describe('Testing legacy renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'account',
 		});
@@ -167,6 +169,7 @@ describe('Testing legacy renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'account-box',
 		});
@@ -214,6 +217,7 @@ describe('Testing legacy renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'home',
 		});
@@ -255,6 +259,7 @@ describe('Testing legacy renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'home',
 		});
@@ -299,6 +304,7 @@ describe('Testing legacy renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'account',
 		});
@@ -372,6 +378,7 @@ describe('Testing legacy renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'home',
 		});
@@ -537,6 +544,7 @@ describe('Testing legacy renderer', () => {
 		expect(element).to.not.be.eql(lastElement); // different 'element' and 'name' properties
 		expect(element.name).to.not.be.eql(lastElement.name);
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'account',
 		});
@@ -582,6 +590,7 @@ describe('Testing legacy renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'home',
 		});
@@ -630,6 +639,7 @@ describe('Testing legacy renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'home',
 		});
@@ -676,6 +686,7 @@ describe('Testing legacy renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'home',
 		});
@@ -764,6 +775,7 @@ describe('Testing legacy renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'home',
 		});
@@ -861,6 +873,7 @@ describe('Testing legacy renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'home',
 		});
@@ -946,6 +959,7 @@ describe('Testing legacy renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'home',
 		});
diff --git a/packages/browser-tests/tests/20-renderer-v2-test.ts b/packages/browser-tests/tests/20-renderer-v2-test.ts
index f88c3a1..8fc0fe6 100644
--- a/packages/browser-tests/tests/20-renderer-v2-test.ts
+++ b/packages/browser-tests/tests/20-renderer-v2-test.ts
@@ -18,7 +18,7 @@ addFinder(iconifyFinder);
 
 describe('Testing renderer', () => {
 	// Add mentioned icons to storage
-	const storage = getStorage('mdi');
+	const storage = getStorage('', 'mdi');
 	addIconSet(storage, {
 		prefix: 'mdi',
 		icons: {
@@ -82,6 +82,7 @@ describe('Testing renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'account-cash',
 		});
@@ -124,6 +125,7 @@ describe('Testing renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'account',
 		});
@@ -167,6 +169,7 @@ describe('Testing renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'account-box',
 		});
@@ -214,6 +217,7 @@ describe('Testing renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'home',
 		});
@@ -255,6 +259,7 @@ describe('Testing renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'home',
 		});
@@ -301,6 +306,7 @@ describe('Testing renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'account',
 		});
@@ -374,6 +380,7 @@ describe('Testing renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'home',
 		});
@@ -541,6 +548,7 @@ describe('Testing renderer', () => {
 		expect(element).to.not.be.eql(lastElement); // different 'element' and 'name' properties
 		expect(element.name).to.not.be.eql(lastElement.name);
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'account',
 		});
@@ -586,6 +594,7 @@ describe('Testing renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'home',
 		});
@@ -634,6 +643,7 @@ describe('Testing renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'home',
 		});
@@ -680,6 +690,7 @@ describe('Testing renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'home',
 		});
@@ -768,6 +779,7 @@ describe('Testing renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'home',
 		});
@@ -865,6 +877,7 @@ describe('Testing renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'home',
 		});
@@ -950,6 +963,7 @@ describe('Testing renderer', () => {
 
 		// Test element
 		expect(element.name).to.be.eql({
+			provider: '',
 			prefix: 'mdi',
 			name: 'home',
 		});
diff --git a/packages/browser-tests/tests/20-scan-dom-test.ts b/packages/browser-tests/tests/20-scan-dom-test.ts
index e35277d..742df50 100644
--- a/packages/browser-tests/tests/20-scan-dom-test.ts
+++ b/packages/browser-tests/tests/20-scan-dom-test.ts
@@ -17,7 +17,7 @@ addFinder(iconifyIconFinder);
 
 describe('Scanning DOM', () => {
 	// Add mentioned icons to storage
-	const storage = getStorage('mdi');
+	const storage = getStorage('', 'mdi');
 	addIconSet(storage, {
 		prefix: 'mdi',
 		icons: {
diff --git a/packages/browser-tests/tests/21-scan-dom-api-test.ts b/packages/browser-tests/tests/21-scan-dom-api-test.ts
index a4fbb32..eaad3d9 100644
--- a/packages/browser-tests/tests/21-scan-dom-api-test.ts
+++ b/packages/browser-tests/tests/21-scan-dom-api-test.ts
@@ -5,7 +5,7 @@ import { getNode } from './node';
 import { addFinder } from '@iconify/iconify/lib/finder';
 import { FakeData, setFakeData, prepareQuery, sendQuery } from './fake-api';
 import { API } from '@iconify/core/lib/api/';
-import { setAPIModule } from '@iconify/core/lib/api/modules';
+import { setDefaultAPIModule } from '@iconify/core/lib/api/modules';
 import { setAPIConfig } from '@iconify/core/lib/api/config';
 import { coreModules } from '@iconify/core/lib/modules';
 import { finder as iconifyFinder } from '@iconify/iconify/lib/finders/iconify';
@@ -20,7 +20,7 @@ addFinder(iconifyFinder);
 addFinder(iconifyIconFinder);
 
 // Set API
-setAPIModule({
+setDefaultAPIModule({
 	prepare: prepareQuery,
 	send: sendQuery,
 });
@@ -33,16 +33,14 @@ function nextPrefix(): string {
 
 describe('Scanning DOM with API', () => {
 	it('Scan DOM with API', (done) => {
+		const provider = nextPrefix();
 		const prefix1 = nextPrefix();
 		const prefix2 = nextPrefix();
 
 		// Set fake API hosts to make test reliable
-		setAPIConfig(
-			{
-				resources: ['https://api1.local', 'https://api2.local'],
-			},
-			[prefix1, prefix2]
-		);
+		setAPIConfig(provider, {
+			resources: ['https://api1.local', 'https://api2.local'],
+		});
 
 		// Set icons, load them with various delay
 		const data1: FakeData = {
@@ -64,7 +62,7 @@ describe('Scanning DOM with API', () => {
 				height: 24,
 			},
 		};
-		setFakeData(prefix1, data1);
+		setFakeData(provider, prefix1, data1);
 
 		const data2: FakeData = {
 			icons: ['account', 'account-box'],
@@ -85,24 +83,32 @@ describe('Scanning DOM with API', () => {
 				height: 24,
 			},
 		};
-		setFakeData(prefix2, data2);
+		setFakeData(provider, prefix2, data2);
 
 		const node = getNode('scan-dom');
 		node.innerHTML =
 			'<div><p>Testing scanning DOM with API</p><ul>' +
 			'<li>Inline icons:' +
-			'   <span class="iconify iconify-inline" data-icon="' +
+			'   <span class="iconify iconify-inline" data-icon="@' +
+			provider +
+			':' +
 			prefix1 +
 			':home" style="color: red; box-shadow: 0 0 2px black;"></span>' +
-			'   <i class="iconify-inline test-icon iconify--mdi-account" data-icon="' +
+			'   <i class="iconify-inline test-icon iconify--mdi-account" data-icon="@' +
+			provider +
+			':' +
 			prefix2 +
 			':account" style="vertical-align: 0;" data-flip="horizontal" aria-hidden="false"></i>' +
 			'</li>' +
 			'<li>Block icons:' +
-			'   <iconify-icon data-icon="' +
+			'   <iconify-icon data-icon="@' +
+			provider +
+			':' +
 			prefix1 +
 			':account-cash" title="&lt;Cash&gt;!"></iconify-icon>' +
-			'   <i class="iconify-icon" data-icon="' +
+			'   <i class="iconify-icon" data-icon="@' +
+			provider +
+			':' +
 			prefix2 +
 			':account-box" data-inline="true" data-rotate="2" data-width="42"></i>' +
 			'</li>' +
@@ -133,16 +139,14 @@ describe('Scanning DOM with API', () => {
 	});
 
 	it('Changing icon name before it loaded', (done) => {
+		const provider = nextPrefix();
 		const prefix1 = nextPrefix();
 		const prefix2 = nextPrefix();
 
 		// Set fake API hosts to make test reliable
-		setAPIConfig(
-			{
-				resources: ['https://api1.local', 'https://api2.local'],
-			},
-			[prefix1, prefix2]
-		);
+		setAPIConfig(provider, {
+			resources: ['https://api1.local', 'https://api2.local'],
+		});
 
 		// Set icons, load them with various delay
 		const data1: FakeData = {
@@ -164,7 +168,7 @@ describe('Scanning DOM with API', () => {
 				height: 24,
 			},
 		};
-		setFakeData(prefix1, data1);
+		setFakeData(provider, prefix1, data1);
 
 		const data2: FakeData = {
 			icons: ['account', 'account-box'],
@@ -185,7 +189,7 @@ describe('Scanning DOM with API', () => {
 				height: 24,
 			},
 		};
-		setFakeData(prefix2, data2);
+		setFakeData(provider, prefix2, data2);
 
 		const data1b: FakeData = {
 			icons: ['account', 'account-box'],
@@ -206,24 +210,32 @@ describe('Scanning DOM with API', () => {
 				height: 24,
 			},
 		};
-		setFakeData(prefix1, data1b);
+		setFakeData(provider, prefix1, data1b);
 
 		const node = getNode('scan-dom');
 		node.innerHTML =
 			'<div><p>Testing scanning DOM with API: renamed icon</p><ul>' +
 			'<li>Default finder:' +
-			'   <span class="iconify-inline first-icon" data-icon="' +
+			'   <span class="iconify-inline first-icon" data-icon="@' +
+			provider +
+			':' +
 			prefix1 +
 			':home" style="color: red; box-shadow: 0 0 2px black;"></span>' +
-			'   <i class="iconify-inline second-icon iconify--mdi-account" data-icon="' +
+			'   <i class="iconify-inline second-icon iconify--mdi-account" data-icon="@' +
+			provider +
+			':' +
 			prefix2 +
 			':account" style="vertical-align: 0;" data-flip="horizontal" aria-hidden="false"></i>' +
 			'</li>' +
 			'<li>IconifyIcon finder:' +
-			'   <iconify-icon class="third-icon" data-icon="' +
+			'   <iconify-icon class="third-icon" data-icon="@' +
+			provider +
+			':' +
 			prefix1 +
 			':account-cash" title="&lt;Cash&gt;!"></iconify-icon>' +
-			'   <iconify-icon class="fourth-icon" data-icon="' +
+			'   <iconify-icon class="fourth-icon" data-icon="@' +
+			provider +
+			':' +
 			prefix2 +
 			':account-box" data-inline="true" data-rotate="2" data-width="42"></iconify-icon>' +
 			'</li>' +
@@ -244,7 +256,10 @@ describe('Scanning DOM with API', () => {
 		const icon = node.querySelector('iconify-icon[title]');
 		expect(icon).to.not.be.equal(null);
 		expect(icon.getAttribute('class')).to.be.equal('third-icon');
-		icon.setAttribute('data-icon', prefix1 + ':account');
+		icon.setAttribute(
+			'data-icon',
+			'@' + provider + ':' + prefix1 + ':account'
+		);
 
 		// First API response should have loaded, but only 1 icon should have been rendered
 		setTimeout(() => {
@@ -273,16 +288,14 @@ describe('Scanning DOM with API', () => {
 	});
 
 	it('Changing icon name before it loaded to invalid name', (done) => {
+		const provider = nextPrefix();
 		const prefix1 = nextPrefix();
 		const prefix2 = nextPrefix();
 
 		// Set fake API hosts to make test reliable
-		setAPIConfig(
-			{
-				resources: ['https://api1.local', 'https://api2.local'],
-			},
-			[prefix1, prefix2]
-		);
+		setAPIConfig(provider, {
+			resources: ['https://api1.local', 'https://api2.local'],
+		});
 
 		// Set icons, load them with various delay
 		const data1: FakeData = {
@@ -304,7 +317,7 @@ describe('Scanning DOM with API', () => {
 				height: 24,
 			},
 		};
-		setFakeData(prefix1, data1);
+		setFakeData(provider, prefix1, data1);
 
 		const data2: FakeData = {
 			icons: ['account', 'account-box'],
@@ -325,24 +338,32 @@ describe('Scanning DOM with API', () => {
 				height: 24,
 			},
 		};
-		setFakeData(prefix2, data2);
+		setFakeData(provider, prefix2, data2);
 
 		const node = getNode('scan-dom');
 		node.innerHTML =
 			'<div><p>Testing scanning DOM with API: invalid name</p><ul>' +
 			'<li>Inline icons:' +
-			'   <span class="iconify" data-icon="' +
+			'   <span class="iconify" data-icon="@' +
+			provider +
+			':' +
 			prefix1 +
 			':home" style="color: red; box-shadow: 0 0 2px black;"></span>' +
-			'   <i class="iconify test-icon iconify--mdi-account" data-icon="' +
+			'   <i class="iconify test-icon iconify--mdi-account" data-icon="@' +
+			provider +
+			':' +
 			prefix2 +
 			':account" style="vertical-align: 0;" data-flip="horizontal" aria-hidden="false"></i>' +
 			'</li>' +
 			'<li>Block icons:' +
-			'   <iconify-icon data-icon="' +
+			'   <iconify-icon data-icon="@' +
+			provider +
+			':' +
 			prefix1 +
 			':account-cash" title="&lt;Cash&gt;!"></iconify-icon>' +
-			'   <iconify-icon data-icon="' +
+			'   <iconify-icon data-icon="@' +
+			provider +
+			':' +
 			prefix2 +
 			':account-box" data-inline="true" data-rotate="2" data-width="42"></iconify-icon>' +
 			'</li>' +
@@ -355,7 +376,7 @@ describe('Scanning DOM with API', () => {
 		// Change icon name
 		const icon = node.querySelector('iconify-icon[title]');
 		expect(icon).to.not.be.equal(null);
-		icon.setAttribute('data-icon', 'foo');
+		icon.setAttribute('data-icon', '@' + provider + ':foo');
 
 		// First API response should have loaded, but only 1 icon
 		setTimeout(() => {
diff --git a/packages/browser-tests/tests/fake-api.ts b/packages/browser-tests/tests/fake-api.ts
index 349f3b6..1c6e732 100644
--- a/packages/browser-tests/tests/fake-api.ts
+++ b/packages/browser-tests/tests/fake-api.ts
@@ -19,13 +19,23 @@ export interface FakeData {
 /**
  * Fake data storage
  */
-const fakeData: Record<string, FakeData[]> = Object.create(null);
+const fakeData: Record<string, Record<string, FakeData[]>> = Object.create(
+	null
+);
 
-export function setFakeData(prefix: string, item: FakeData): void {
-	if (fakeData[prefix] === void 0) {
-		fakeData[prefix] = [];
+export function setFakeData(
+	provider: string,
+	prefix: string,
+	item: FakeData
+): void {
+	if (fakeData[provider] === void 0) {
+		fakeData[provider] = Object.create(null);
 	}
-	fakeData[prefix].push(item);
+	const providerFakeData = fakeData[provider];
+	if (providerFakeData[prefix] === void 0) {
+		providerFakeData[prefix] = [];
+	}
+	providerFakeData[prefix].push(item);
 }
 
 interface FakeAPIQueryParams extends APIQueryParams {
@@ -36,6 +46,7 @@ interface FakeAPIQueryParams extends APIQueryParams {
  * Prepare params
  */
 export const prepareQuery: IconifyAPIPrepareQuery = (
+	provider: string,
 	prefix: string,
 	icons: string[]
 ): APIQueryParams[] => {
@@ -43,10 +54,15 @@ export const prepareQuery: IconifyAPIPrepareQuery = (
 	const items: APIQueryParams[] = [];
 	let missing = icons.slice(0);
 
-	if (fakeData[prefix] !== void 0) {
-		fakeData[prefix].forEach(item => {
+	if (fakeData[provider] === void 0) {
+		fakeData[provider] = Object.create(null);
+	}
+	const providerFakeData = fakeData[provider];
+
+	if (providerFakeData[prefix] !== void 0) {
+		providerFakeData[prefix].forEach((item) => {
 			const matches = item.icons.filter(
-				icon => missing.indexOf(icon) !== -1
+				(icon) => missing.indexOf(icon) !== -1
 			);
 			if (!matches.length) {
 				// No match
@@ -54,8 +70,9 @@ export const prepareQuery: IconifyAPIPrepareQuery = (
 			}
 
 			// Contains at least one matching icon
-			missing = missing.filter(icon => matches.indexOf(icon) === -1);
+			missing = missing.filter((icon) => matches.indexOf(icon) === -1);
 			const query: FakeAPIQueryParams = {
+				provider,
 				prefix,
 				icons: matches,
 				data: item,
@@ -75,6 +92,7 @@ export const sendQuery: IconifyAPISendQuery = (
 	params: APIQueryParams,
 	status: RedundancyPendingItem
 ): void => {
+	const provider = params.provider;
 	const prefix = params.prefix;
 	const icons = params.icons;
 
@@ -88,7 +106,13 @@ export const sendQuery: IconifyAPISendQuery = (
 	}
 
 	const sendResponse = () => {
-		console.log('Sending data for prefix "' + prefix + '", icons:', icons);
+		console.log(
+			'Sending data for prefix "' +
+				(provider === '' ? '' : '@' + provider + ':') +
+				prefix +
+				'", icons:',
+			icons
+		);
 		status.done(data.data);
 	};
 
diff --git a/packages/core/src/api/callbacks.ts b/packages/core/src/api/callbacks.ts
index b30db0f..8fc2973 100644
--- a/packages/core/src/api/callbacks.ts
+++ b/packages/core/src/api/callbacks.ts
@@ -4,6 +4,7 @@ import {
 } from '../interfaces/loader';
 import { getStorage } from '../storage';
 import { SortedIcons } from '../icon/sort';
+import { IconifyIconSource } from '../icon/name';
 
 /**
  * Storage for callbacks
@@ -22,49 +23,70 @@ interface CallbackItem {
 	abort: IconifyIconLoaderAbort;
 }
 
+// Records sorted by provider and prefix
 // This export is only for unit testing, should not be used
-export const callbacks: Record<string, CallbackItem[]> = Object.create(null);
-const pendingUpdates: Record<string, boolean> = Object.create(null);
+export const callbacks: Record<
+	string,
+	Record<string, CallbackItem[]>
+> = Object.create(null);
+const pendingUpdates: Record<string, Record<string, boolean>> = Object.create(
+	null
+);
 
 /**
  * Remove callback
  */
-function removeCallback(prefixes: string[], id: number): void {
-	prefixes.forEach(prefix => {
-		const items = callbacks[prefix];
+function removeCallback(sources: IconifyIconSource[], id: number): void {
+	sources.forEach((source) => {
+		const provider = source.provider;
+		if (callbacks[provider] === void 0) {
+			return;
+		}
+		const providerCallbacks = callbacks[provider];
+
+		const prefix = source.prefix;
+		const items = providerCallbacks[prefix];
 		if (items) {
-			callbacks[prefix] = items.filter(row => row.id !== id);
+			providerCallbacks[prefix] = items.filter((row) => row.id !== id);
 		}
 	});
 }
 
 /**
- * Update all callbacks for prefix
+ * Update all callbacks for provider and prefix
  */
-export function updateCallbacks(prefix: string): void {
-	if (!pendingUpdates[prefix]) {
-		pendingUpdates[prefix] = true;
-		setTimeout(() => {
-			pendingUpdates[prefix] = false;
+export function updateCallbacks(provider: string, prefix: string): void {
+	if (pendingUpdates[provider] === void 0) {
+		pendingUpdates[provider] = Object.create(null);
+	}
+	const providerPendingUpdates = pendingUpdates[provider];
 
-			if (callbacks[prefix] === void 0) {
+	if (!providerPendingUpdates[prefix]) {
+		providerPendingUpdates[prefix] = true;
+		setTimeout(() => {
+			providerPendingUpdates[prefix] = false;
+
+			if (
+				callbacks[provider] === void 0 ||
+				callbacks[provider][prefix] === void 0
+			) {
 				return;
 			}
 
 			// Get all items
-			const items = callbacks[prefix].slice(0);
+			const items = callbacks[provider][prefix].slice(0);
 			if (!items.length) {
 				return;
 			}
 
-			const storage = getStorage(prefix);
+			const storage = getStorage(provider, prefix);
 
 			// Check each item for changes
 			let hasPending = false;
 			items.forEach((item: CallbackItem) => {
 				const icons = item.icons;
 				const oldLength = icons.pending.length;
-				icons.pending = icons.pending.filter(icon => {
+				icons.pending = icons.pending.filter((icon) => {
 					if (icon.prefix !== prefix) {
 						// Checking only current prefix
 						return true;
@@ -74,12 +96,14 @@ export function updateCallbacks(prefix: string): void {
 					if (storage.icons[name] !== void 0) {
 						// Loaded
 						icons.loaded.push({
+							provider,
 							prefix,
 							name,
 						});
 					} else if (storage.missing[name] !== void 0) {
 						// Missing
 						icons.missing.push({
+							provider,
 							prefix,
 							name,
 						});
@@ -96,7 +120,15 @@ export function updateCallbacks(prefix: string): void {
 				if (icons.pending.length !== oldLength) {
 					if (!hasPending) {
 						// All icons have been loaded - remove callback from prefix
-						removeCallback([prefix], item.id);
+						removeCallback(
+							[
+								{
+									provider,
+									prefix,
+								},
+							],
+							item.id
+						);
 					}
 					item.callback(
 						icons.loaded.slice(0),
@@ -121,11 +153,11 @@ let idCounter = 0;
 export function storeCallback(
 	callback: IconifyIconLoaderCallback,
 	icons: SortedIcons,
-	pendingPrefixes: string[]
+	pendingSources: IconifyIconSource[]
 ): IconifyIconLoaderAbort {
 	// Create unique id and abort function
 	const id = idCounter++;
-	const abort = removeCallback.bind(null, pendingPrefixes, id);
+	const abort = removeCallback.bind(null, pendingSources, id);
 
 	if (!icons.pending.length) {
 		// Do not store item without pending icons and return function that does nothing
@@ -140,11 +172,17 @@ export function storeCallback(
 		abort: abort,
 	};
 
-	pendingPrefixes.forEach(prefix => {
-		if (callbacks[prefix] === void 0) {
-			callbacks[prefix] = [];
+	pendingSources.forEach((source) => {
+		const provider = source.provider;
+		const prefix = source.prefix;
+		if (callbacks[provider] === void 0) {
+			callbacks[provider] = Object.create(null);
 		}
-		callbacks[prefix].push(item);
+		const providerCallbacks = callbacks[provider];
+		if (providerCallbacks[prefix] === void 0) {
+			providerCallbacks[prefix] = [];
+		}
+		providerCallbacks[prefix].push(item);
 	});
 
 	return abort;
diff --git a/packages/core/src/api/config.ts b/packages/core/src/api/config.ts
index 485fd75..a7a39e0 100644
--- a/packages/core/src/api/config.ts
+++ b/packages/core/src/api/config.ts
@@ -1,5 +1,4 @@
 import { RedundancyConfig } from '@cyberalien/redundancy';
-import { merge } from '../misc/merge';
 
 /**
  * API config
@@ -12,17 +11,52 @@ export interface IconifyAPIConfig extends RedundancyConfig {
 	maxURL: number;
 }
 
-/**
- * Local storage interfaces
- */
-interface ConfigStorage {
-	// API configuration for all prefixes
-	default: IconifyAPIConfig;
+export type PartialIconifyAPIConfig = Partial<IconifyAPIConfig>;
 
-	// Prefix specific API configuration
-	prefixes: Record<string, IconifyAPIConfig>;
+/**
+ * Create full API configuration from partial data
+ */
+function createConfig(
+	source: PartialIconifyAPIConfig
+): IconifyAPIConfig | null {
+	if (!source.resources) {
+		return null;
+	}
+
+	const result: IconifyAPIConfig = {
+		// API hosts
+		resources: source.resources,
+
+		// Root path
+		path: source.path === void 0 ? '/' : source.path,
+
+		// URL length limit
+		maxURL: source.maxURL ? source.maxURL : 500,
+
+		// Timeout before next host is used.
+		rotate: source.rotate ? source.rotate : 750,
+
+		// Timeout to retry same host.
+		timeout: source.timeout ? source.timeout : 5000,
+
+		// Number of attempts for each host.
+		limit: source.limit ? source.limit : 2,
+
+		// Randomise default API end point.
+		random: source.random === true,
+
+		// Start index
+		index: source.index ? source.index : 0,
+	};
+
+	return result;
 }
 
+/**
+ * Local storage
+ */
+const configStorage: Record<string, IconifyAPIConfig> = Object.create(null);
+
 /**
  * Redundancy for API servers.
  *
@@ -58,70 +92,28 @@ while (fallBackAPISources.length > 0) {
 	}
 }
 
-/**
- * Default configuration
- */
-const defaultConfig: IconifyAPIConfig = {
-	// API hosts
+// Add default API
+configStorage[''] = createConfig({
 	resources: ['https://api.iconify.design'].concat(fallBackAPI),
-
-	// Root path
-	path: '/',
-
-	// URL length limit
-	maxURL: 500,
-
-	// Timeout before next host is used.
-	rotate: 750,
-
-	// Timeout to retry same host.
-	timeout: 5000,
-
-	// Number of attempts for each host.
-	limit: 2,
-
-	// Randomise default API end point.
-	random: false,
-
-	// Start index
-	index: 0,
-};
+}) as IconifyAPIConfig;
 
 /**
- * Local storage
- */
-const configStorage: ConfigStorage = {
-	default: defaultConfig,
-	prefixes: Object.create(null),
-};
-
-/**
- * Add custom config for prefix(es)
- *
- * This function should be used before any API queries.
- * On first API query computed configuration will be cached, so changes to config will not take effect.
+ * Add custom config for provider
  */
 export function setAPIConfig(
-	customConfig: Partial<IconifyAPIConfig>,
-	prefix?: string | string[]
+	provider: string,
+	customConfig: PartialIconifyAPIConfig
 ): void {
-	const mergedConfig = merge(
-		configStorage.default,
-		customConfig
-	) as IconifyAPIConfig;
-	if (prefix === void 0) {
-		configStorage.default = mergedConfig;
+	const config = createConfig(customConfig);
+	if (config === null) {
 		return;
 	}
-	(typeof prefix === 'string' ? [prefix] : prefix).forEach(prefix => {
-		configStorage.prefixes[prefix] = mergedConfig;
-	});
+	configStorage[provider] = config;
 }
 
 /**
  * Get API configuration
  */
-export function getAPIConfig(prefix: string): IconifyAPIConfig | null {
-	const value = configStorage.prefixes[prefix];
-	return value === void 0 ? configStorage.default : value;
+export function getAPIConfig(provider: string): IconifyAPIConfig | undefined {
+	return configStorage[provider];
 }
diff --git a/packages/core/src/api/index.ts b/packages/core/src/api/index.ts
index efbf1f4..29ad4c0 100644
--- a/packages/core/src/api/index.ts
+++ b/packages/core/src/api/index.ts
@@ -15,8 +15,8 @@ import { getAPIModule } from './modules';
 import { getAPIConfig, IconifyAPIConfig } from './config';
 import { getStorage, addIconSet } from '../storage';
 import { coreModules } from '../modules';
-import { IconifyIconName } from '../icon/name';
-import { listToIcons, getPrefixes } from '../icon/list';
+import { IconifyIconName, IconifyIconSource } from '../icon/name';
+import { listToIcons } from '../icon/list';
 import { IconifyJSON } from '@iconify/types';
 
 // Empty abort callback for loadIcons()
@@ -32,10 +32,13 @@ function emptyCallback(): void {
  * either an icon or a missing icon. This way same icon should
  * never be requested twice.
  *
- * [prefix][icon] = time when icon was added to queue
+ * [provider][prefix][icon] = time when icon was added to queue
  */
 type PendingIcons = Record<string, number>;
-const pendingIcons: Record<string, PendingIcons> = Object.create(null);
+const pendingIcons: Record<
+	string,
+	Record<string, PendingIcons>
+> = Object.create(null);
 
 /**
  * List of icons that are waiting to be loaded.
@@ -45,31 +48,39 @@ const pendingIcons: Record<string, PendingIcons> = Object.create(null);
  * This list should not be used for any checks, use pendingIcons to check
  * if icons is being loaded.
  *
- * [prefix] = array of icon names
+ * [provider][prefix] = array of icon names
  */
-const iconsToLoad: Record<string, string[]> = Object.create(null);
+const iconsToLoad: Record<string, Record<string, string[]>> = Object.create(
+	null
+);
 
 // Flags to merge multiple synchronous icon requests in one asynchronous request
-const loaderFlags: Record<string, boolean> = Object.create(null);
-const queueFlags: Record<string, boolean> = Object.create(null);
+const loaderFlags: Record<string, Record<string, boolean>> = Object.create(
+	null
+);
+const queueFlags: Record<string, Record<string, boolean>> = Object.create(null);
 
-// Redundancy instances cache
+// Redundancy instances cache, sorted by provider
 interface LocalCache {
-	config: IconifyAPIConfig | null;
-	redundancy: Redundancy | null;
+	config: IconifyAPIConfig;
+	redundancy: Redundancy;
 }
 const redundancyCache: Record<string, LocalCache> = Object.create(null);
 
 /**
  * Function called when new icons have been loaded
  */
-function loadedNewIcons(prefix: string): void {
+function loadedNewIcons(provider: string, prefix: string): void {
 	// Run only once per tick, possibly joining multiple API responses in one call
-	if (!loaderFlags[prefix]) {
-		loaderFlags[prefix] = true;
+	if (loaderFlags[provider] === void 0) {
+		loaderFlags[provider] = Object.create(null);
+	}
+	const providerLoaderFlags = loaderFlags[provider];
+	if (!providerLoaderFlags[prefix]) {
+		providerLoaderFlags[prefix] = true;
 		setTimeout(() => {
-			loaderFlags[prefix] = false;
-			updateCallbacks(prefix);
+			providerLoaderFlags[prefix] = false;
+			updateCallbacks(provider, prefix);
 		});
 	}
 }
@@ -77,7 +88,7 @@ function loadedNewIcons(prefix: string): void {
 /**
  * Load icons
  */
-function loadNewIcons(prefix: string, icons: string[]): void {
+function loadNewIcons(provider: string, prefix: string, icons: string[]): void {
 	function err(): void {
 		console.error(
 			'Unable to retrieve icons for prefix "' +
@@ -86,68 +97,82 @@ function loadNewIcons(prefix: string, icons: string[]): void {
 		);
 	}
 
+	// Create nested objects if needed
+	if (iconsToLoad[provider] === void 0) {
+		iconsToLoad[provider] = Object.create(null);
+	}
+	const providerIconsToLoad = iconsToLoad[provider];
+
+	if (queueFlags[provider] === void 0) {
+		queueFlags[provider] = Object.create(null);
+	}
+	const providerQueueFlags = queueFlags[provider];
+
+	if (pendingIcons[provider] === void 0) {
+		pendingIcons[provider] = Object.create(null);
+	}
+	const providerPendingIcons = pendingIcons[provider];
+
 	// Add icons to queue
-	if (iconsToLoad[prefix] === void 0) {
-		iconsToLoad[prefix] = icons;
+	if (providerIconsToLoad[prefix] === void 0) {
+		providerIconsToLoad[prefix] = icons;
 	} else {
-		iconsToLoad[prefix] = iconsToLoad[prefix].concat(icons).sort();
+		providerIconsToLoad[prefix] = providerIconsToLoad[prefix]
+			.concat(icons)
+			.sort();
 	}
 
+	// Redundancy item
+	let cachedReundancy: LocalCache;
+
 	// Trigger update on next tick, mering multiple synchronous requests into one asynchronous request
-	if (!queueFlags[prefix]) {
-		queueFlags[prefix] = true;
+	if (!providerQueueFlags[prefix]) {
+		providerQueueFlags[prefix] = true;
 		setTimeout(() => {
-			queueFlags[prefix] = false;
+			providerQueueFlags[prefix] = false;
 
 			// Get icons and delete queue
-			const icons = iconsToLoad[prefix];
-			delete iconsToLoad[prefix];
+			const icons = providerIconsToLoad[prefix];
+			delete providerIconsToLoad[prefix];
 
 			// Get API module
-			const api = getAPIModule(prefix);
+			const api = getAPIModule(provider);
 			if (!api) {
 				// No way to load icons!
 				err();
 				return;
 			}
 
-			// Get Redundancy instance
-			if (redundancyCache[prefix] === void 0) {
-				const config = getAPIConfig(prefix);
-
-				// Attempt to find matching instance from other prefixes
-				// Using same Redundancy instance allows keeping track of failed hosts for multiple prefixes
-				for (const prefix2 in redundancyCache) {
-					const item = redundancyCache[prefix2];
-					if (item.config === config) {
-						redundancyCache[prefix] = item;
-						break;
+			// Get API config and Redundancy instance
+			if (cachedReundancy === void 0) {
+				if (redundancyCache[provider] === void 0) {
+					const config = getAPIConfig(provider);
+					if (!config) {
+						// No way to load icons because configuration is not set!
+						err();
+						return;
 					}
-				}
 
-				if (redundancyCache[prefix] === void 0) {
-					redundancyCache[prefix] = {
+					const redundancy = initRedundancy(config);
+					cachedReundancy = {
 						config,
-						redundancy: config ? initRedundancy(config) : null,
+						redundancy,
 					};
+					redundancyCache[provider] = cachedReundancy;
+				} else {
+					cachedReundancy = redundancyCache[provider];
 				}
 			}
-			const redundancy = redundancyCache[prefix].redundancy;
-			if (!redundancy) {
-				// No way to load icons because configuration is not set!
-				err();
-				return;
-			}
 
 			// Prepare parameters and run queries
-			const params = api.prepare(prefix, icons);
+			const params = api.prepare(provider, prefix, icons);
 			params.forEach((item) => {
-				redundancy.query(
+				cachedReundancy.redundancy.query(
 					item,
 					api.send as RedundancyQueryCallback,
 					(data) => {
 						// Add icons to storage
-						const storage = getStorage(prefix);
+						const storage = getStorage(provider, prefix);
 						try {
 							const added = addIconSet(
 								storage,
@@ -159,21 +184,24 @@ function loadNewIcons(prefix: string, icons: string[]): void {
 							}
 
 							// Remove added icons from pending list
-							const pending = pendingIcons[prefix];
+							const pending = providerPendingIcons[prefix];
 							added.forEach((name) => {
 								delete pending[name];
 							});
 
 							// Cache API response
 							if (coreModules.cache) {
-								coreModules.cache(data as IconifyJSON);
+								coreModules.cache(
+									provider,
+									data as IconifyJSON
+								);
 							}
 						} catch (err) {
 							console.error(err);
 						}
 
 						// Trigger update on next tick
-						loadedNewIcons(prefix);
+						loadedNewIcons(provider, prefix);
 					}
 				);
 			});
@@ -184,9 +212,11 @@ function loadNewIcons(prefix: string, icons: string[]): void {
 /**
  * Check if icon is being loaded
  */
-const isPending: IsPending = (prefix: string, icon: string): boolean => {
+const isPending: IsPending = (icon: IconifyIconName): boolean => {
 	return (
-		pendingIcons[prefix] !== void 0 && pendingIcons[prefix][icon] !== void 0
+		pendingIcons[icon.provider] !== void 0 &&
+		pendingIcons[icon.provider][icon.prefix] !== void 0 &&
+		pendingIcons[icon.provider][icon.prefix][icon.name] !== void 0
 	);
 };
 
@@ -225,16 +255,42 @@ const loadIcons: IconifyLoadIcons = (
 		};
 	}
 
-	// Get all prefixes
-	const prefixes = getPrefixes(sortedIcons.pending);
+	// Get all sources for pending icons
+	const newIcons: Record<string, Record<string, string[]>> = Object.create(
+		null
+	);
+	const sources: IconifyIconSource[] = [];
+	let lastProvider: string, lastPrefix: string;
 
-	// Get pending icons queue for prefix and create new icons list
-	const newIcons: Record<string, string[]> = Object.create(null);
-	prefixes.forEach((prefix) => {
-		if (pendingIcons[prefix] === void 0) {
-			pendingIcons[prefix] = Object.create(null);
+	sortedIcons.pending.forEach((icon) => {
+		const provider = icon.provider;
+		const prefix = icon.prefix;
+		if (prefix === lastPrefix && provider === lastProvider) {
+			return;
+		}
+
+		lastProvider = provider;
+		lastPrefix = prefix;
+		sources.push({
+			provider,
+			prefix,
+		});
+
+		if (pendingIcons[provider] === void 0) {
+			pendingIcons[provider] = Object.create(null);
+		}
+		const providerPendingIcons = pendingIcons[provider];
+		if (providerPendingIcons[prefix] === void 0) {
+			providerPendingIcons[prefix] = Object.create(null);
+		}
+
+		if (newIcons[provider] === void 0) {
+			newIcons[provider] = Object.create(null);
+		}
+		const providerNewIcons = newIcons[provider];
+		if (providerNewIcons[prefix] === void 0) {
+			providerNewIcons[prefix] = [];
 		}
-		newIcons[prefix] = [];
 	});
 
 	// List of new icons
@@ -244,29 +300,32 @@ const loadIcons: IconifyLoadIcons = (
 	// If icon was called before, it must exist in pendingIcons or storage, but because this
 	// function is called right after sortIcons() that checks storage, icon is definitely not in storage.
 	sortedIcons.pending.forEach((icon) => {
+		const provider = icon.provider;
 		const prefix = icon.prefix;
 		const name = icon.name;
 
-		const pendingQueue = pendingIcons[prefix];
+		const pendingQueue = pendingIcons[provider][prefix];
 		if (pendingQueue[name] === void 0) {
 			// New icon - add to pending queue to mark it as being loaded
 			pendingQueue[name] = time;
 			// Add it to new icons list to pass it to API module for loading
-			newIcons[prefix].push(name);
+			newIcons[provider][prefix].push(name);
 		}
 	});
 
 	// Load icons on next tick to make sure result is not returned before callback is stored and
 	// to consolidate multiple synchronous loadIcons() calls into one asynchronous API call
-	prefixes.forEach((prefix) => {
-		if (newIcons[prefix].length) {
-			loadNewIcons(prefix, newIcons[prefix]);
+	sources.forEach((source) => {
+		const provider = source.provider;
+		const prefix = source.prefix;
+		if (newIcons[provider][prefix].length) {
+			loadNewIcons(provider, prefix, newIcons[provider][prefix]);
 		}
 	});
 
 	// Store callback and return abort function
 	return callback
-		? storeCallback(callback, sortedIcons, prefixes)
+		? storeCallback(callback, sortedIcons, sources)
 		: emptyCallback;
 };
 
diff --git a/packages/core/src/api/modules.ts b/packages/core/src/api/modules.ts
index 2859eb9..5e0385e 100644
--- a/packages/core/src/api/modules.ts
+++ b/packages/core/src/api/modules.ts
@@ -4,6 +4,7 @@ import { RedundancyPendingItem } from '@cyberalien/redundancy';
  * Params for sendQuery()
  */
 export interface APIQueryParams {
+	provider: string;
 	prefix: string;
 	icons: string[];
 }
@@ -12,6 +13,7 @@ export interface APIQueryParams {
  * Functions to implement in module
  */
 export type IconifyAPIPrepareQuery = (
+	provider: string,
 	prefix: string,
 	icons: string[]
 ) => APIQueryParams[];
@@ -33,43 +35,36 @@ export interface IconifyAPIModule {
 /**
  * Local storate types and entries
  */
-interface ModuleStorage {
-	default: IconifyAPIModule | null;
-	prefixes: Record<string, IconifyAPIModule>;
+interface ModulesStorage {
+	default?: IconifyAPIModule;
+	providers: Record<string, IconifyAPIModule>;
 }
-
-const storage: ModuleStorage = {
-	default: null,
-	prefixes: Object.create(null),
+const storage: ModulesStorage = {
+	providers: Object.create(null),
 };
 
 /**
- * Set API module
- *
- * If prefix is not set, function sets default method.
- * If prefix is a string or array of strings, function sets method only for those prefixes.
- *
- * This should be used before sending any API requests. If used after sending API request, method
- * is already cached so changing callback will not have any effect.
+ * Set default API module
  */
-export function setAPIModule(
-	item: IconifyAPIModule,
-	prefix?: string | string[]
-): void {
-	if (prefix === void 0) {
-		storage.default = item;
-		return;
-	}
+export function setDefaultAPIModule(item: IconifyAPIModule): void {
+	storage.default = item;
+}
 
-	(typeof prefix === 'string' ? [prefix] : prefix).forEach(prefix => {
-		storage.prefixes[prefix] = item;
-	});
+/**
+ * Set API module
+ */
+export function setProviderAPIModule(
+	provider: string,
+	item: IconifyAPIModule
+): void {
+	storage.providers[provider] = item;
 }
 
 /**
  * Get API module
  */
-export function getAPIModule(prefix: string): IconifyAPIModule | null {
-	const value = storage.prefixes[prefix];
-	return value === void 0 ? storage.default : value;
+export function getAPIModule(provider: string): IconifyAPIModule | undefined {
+	return storage.providers[provider] === void 0
+		? storage.default
+		: storage.providers[provider];
 }
diff --git a/packages/core/src/cache/storage.ts b/packages/core/src/cache/storage.ts
index 3dbde5d..00a28ac 100644
--- a/packages/core/src/cache/storage.ts
+++ b/packages/core/src/cache/storage.ts
@@ -13,13 +13,14 @@ type StorageEmptyList = StorageType<number[]>;
 
 export interface StoredItem {
 	cached: number;
+	provider: string;
 	data: IconifyJSON;
 }
 
 // After changing configuration change it in tests/*/fake_cache.ts
 
 // Cache version. Bump when structure changes
-const cacheVersion = 'iconify1';
+const cacheVersion = 'iconify2';
 
 // Cache keys
 const cachePrefix = 'iconify';
@@ -200,14 +201,16 @@ export const loadCache: LoadIconsCache = (): void => {
 					typeof data !== 'object' ||
 					typeof data.cached !== 'number' ||
 					data.cached < minTime ||
+					typeof data.provider !== 'string' ||
 					typeof data.data !== 'object' ||
 					typeof data.data.prefix !== 'string'
 				) {
 					valid = false;
 				} else {
 					// Add icon set
+					const provider = data.provider;
 					const prefix = data.data.prefix;
-					const storage = getStorage(prefix);
+					const storage = getStorage(provider, prefix);
 					valid = addIconSet(storage, data.data) as boolean;
 				}
 			} catch (err) {
@@ -263,7 +266,10 @@ export const loadCache: LoadIconsCache = (): void => {
 /**
  * Function to cache icons
  */
-export const storeCache: CacheIcons = (data: IconifyJSON): void => {
+export const storeCache: CacheIcons = (
+	provider: string,
+	data: IconifyJSON
+): void => {
 	if (!loaded) {
 		loadCache();
 	}
@@ -292,6 +298,7 @@ export const storeCache: CacheIcons = (data: IconifyJSON): void => {
 		try {
 			const item: StoredItem = {
 				cached: Math.floor(Date.now() / hour),
+				provider,
 				data,
 			};
 			func.setItem(cachePrefix + index, JSON.stringify(item));
diff --git a/packages/core/src/icon/list.ts b/packages/core/src/icon/list.ts
index 90c631e..34e19a8 100644
--- a/packages/core/src/icon/list.ts
+++ b/packages/core/src/icon/list.ts
@@ -9,13 +9,14 @@ export function listToIcons(
 ): IconifyIconName[] {
 	const result: IconifyIconName[] = [];
 
-	list.forEach(item => {
+	list.forEach((item) => {
 		const icon: IconifyIconName =
 			typeof item === 'string'
 				? (stringToIcon(item) as IconifyIconName)
 				: item;
 		if (!validate || validateIcon(icon)) {
 			result.push({
+				provider: icon.provider,
 				prefix: icon.prefix,
 				name: icon.name,
 			});
@@ -26,12 +27,12 @@ export function listToIcons(
 }
 
 /**
- * Get all prefixes
+ * Get all providers
  */
-export function getPrefixes(list: IconifyIconName[]): string[] {
-	const prefixes: Record<string, boolean> = Object.create(null);
-	list.forEach(icon => {
-		prefixes[icon.prefix] = true;
+export function getProviders(list: IconifyIconName[]): string[] {
+	const providers: Record<string, boolean> = Object.create(null);
+	list.forEach((icon) => {
+		providers[icon.provider] = true;
 	});
-	return Object.keys(prefixes);
+	return Object.keys(providers);
 }
diff --git a/packages/core/src/icon/name.ts b/packages/core/src/icon/name.ts
index 96b4ab1..2cb2fc1 100644
--- a/packages/core/src/icon/name.ts
+++ b/packages/core/src/icon/name.ts
@@ -2,10 +2,16 @@
  * Icon name
  */
 export interface IconifyIconName {
+	readonly provider: string;
 	readonly prefix: string;
 	readonly name: string;
 }
 
+/**
+ * Icon source: icon object without name
+ */
+export type IconifyIconSource = Omit<IconifyIconName, 'name'>;
+
 /**
  * Expression to test part of icon name.
  */
@@ -15,22 +21,40 @@ const match = /^[a-z0-9]+(-[a-z0-9]+)*$/;
  * Convert string to Icon object.
  */
 export const stringToIcon = (value: string): IconifyIconName | null => {
-	// Attempt to split by colon: "prefix:name"
+	let provider = '';
 	const colonSeparated = value.split(':');
-	if (colonSeparated.length > 2) {
+
+	// Check for provider with correct '@' at start
+	if (value.slice(0, 1) === '@') {
+		// First part is provider
+		if (colonSeparated.length < 2 || colonSeparated.length > 3) {
+			// "@provider:prefix:name" or "@provider:prefix-name"
+			return null;
+		}
+		provider = (colonSeparated.shift() as string).slice(1);
+	}
+
+	// Check split by colon: "prefix:name", "provider:prefix:name"
+	if (colonSeparated.length > 3 || !colonSeparated.length) {
 		return null;
 	}
-	if (colonSeparated.length === 2) {
+	if (colonSeparated.length > 1) {
+		// "prefix:name"
+		const name = colonSeparated.pop() as string;
+		const prefix = colonSeparated.pop() as string;
 		return {
-			prefix: colonSeparated[0],
-			name: colonSeparated[1],
+			// Allow provider without '@': "provider:prefix:name"
+			provider: colonSeparated.length > 0 ? colonSeparated[0] : provider,
+			prefix,
+			name,
 		};
 	}
 
 	// Attempt to split by dash: "prefix-name"
-	const dashSeparated = value.split('-');
+	const dashSeparated = colonSeparated[0].split('-');
 	if (dashSeparated.length > 1) {
 		return {
+			provider: provider,
 			prefix: dashSeparated.shift() as string,
 			name: dashSeparated.join('-'),
 		};
@@ -49,5 +73,9 @@ export const validateIcon = (icon: IconifyIconName | null): boolean => {
 		return false;
 	}
 
-	return !!(icon.prefix.match(match) && icon.name.match(match));
+	return !!(
+		(icon.provider === '' || icon.provider.match(match)) &&
+		icon.prefix.match(match) &&
+		icon.name.match(match)
+	);
 };
diff --git a/packages/core/src/icon/sort.ts b/packages/core/src/icon/sort.ts
index 5534ad9..fc85325 100644
--- a/packages/core/src/icon/sort.ts
+++ b/packages/core/src/icon/sort.ts
@@ -19,35 +19,50 @@ export function sortIcons(icons: IconifyIconName[]): SortedIcons {
 		missing: [],
 		pending: [],
 	};
-	const storage: Record<string, IconStorage> = Object.create(null);
+	const storage: Record<string, Record<string, IconStorage>> = Object.create(
+		null
+	);
 
 	// Sort icons alphabetically to prevent duplicates and make sure they are sorted in API queries
 	icons.sort((a, b) => {
-		if (a.prefix === b.prefix) {
-			return a.name.localeCompare(b.name);
+		if (a.provider !== b.provider) {
+			return a.provider.localeCompare(b.provider);
 		}
-		return a.prefix.localeCompare(b.prefix);
+		if (a.prefix !== b.prefix) {
+			return a.prefix.localeCompare(b.prefix);
+		}
+		return a.name.localeCompare(b.name);
 	});
 
 	let lastIcon: IconifyIconName = {
+		provider: '',
 		prefix: '',
 		name: '',
 	};
-	icons.forEach(icon => {
-		if (lastIcon.prefix === icon.prefix && lastIcon.name === icon.name) {
+	icons.forEach((icon) => {
+		if (
+			lastIcon.name === icon.name &&
+			lastIcon.prefix === icon.prefix &&
+			lastIcon.provider === icon.provider
+		) {
 			return;
 		}
 		lastIcon = icon;
 
 		// Check icon
+		const provider = icon.provider;
 		const prefix = icon.prefix;
 		const name = icon.name;
 
-		if (storage[prefix] === void 0) {
-			storage[prefix] = getStorage(prefix);
+		if (storage[provider] === void 0) {
+			storage[provider] = Object.create(null);
 		}
+		const providerStorage = storage[provider];
 
-		const localStorage = storage[prefix];
+		if (providerStorage[prefix] === void 0) {
+			providerStorage[prefix] = getStorage(provider, prefix);
+		}
+		const localStorage = providerStorage[prefix];
 
 		let list;
 		if (localStorage.icons[name] !== void 0) {
@@ -59,6 +74,7 @@ export function sortIcons(icons: IconifyIconName[]): SortedIcons {
 		}
 
 		const item: IconifyIconName = {
+			provider,
 			prefix,
 			name,
 		};
diff --git a/packages/core/src/interfaces/api.ts b/packages/core/src/interfaces/api.ts
index a9ae503..1e985e4 100644
--- a/packages/core/src/interfaces/api.ts
+++ b/packages/core/src/interfaces/api.ts
@@ -1,9 +1,10 @@
 import { IconifyLoadIcons } from './loader';
+import { IconifyIconName } from '../icon/name';
 
 /**
  * Function to check if icon is pending
  */
-export type IsPending = (prefix: string, name: string) => boolean;
+export type IsPending = (icon: IconifyIconName) => boolean;
 
 /**
  * API interface
diff --git a/packages/core/src/interfaces/cache.ts b/packages/core/src/interfaces/cache.ts
index 9d9b334..4e0f874 100644
--- a/packages/core/src/interfaces/cache.ts
+++ b/packages/core/src/interfaces/cache.ts
@@ -3,7 +3,7 @@ import { IconifyJSON } from '@iconify/types';
 /**
  * Function to cache loaded icons set
  */
-export type CacheIcons = (data: IconifyJSON) => void;
+export type CacheIcons = (provider: string, data: IconifyJSON) => void;
 
 /**
  * Function to load icons from cache
diff --git a/packages/core/src/storage/index.ts b/packages/core/src/storage/index.ts
index 39e4ed9..0868779 100644
--- a/packages/core/src/storage/index.ts
+++ b/packages/core/src/storage/index.ts
@@ -24,21 +24,25 @@ type IconRecords = Record<string, FullIconifyIcon | null>;
  * Storage type
  */
 export interface IconStorage {
+	provider: string;
 	prefix: string;
 	icons: IconRecords;
 	missing: Record<string, number>;
 }
 
 /**
- * Storage by prefix
+ * Storage by provider and prefix
  */
-const storage: Record<string, IconStorage> = Object.create(null);
+const storage: Record<string, Record<string, IconStorage>> = Object.create(
+	null
+);
 
 /**
  * Create new storage
  */
-export function newStorage(prefix: string): IconStorage {
+export function newStorage(provider: string, prefix: string): IconStorage {
 	return {
+		provider,
 		prefix,
 		icons: Object.create(null),
 		missing: Object.create(null),
@@ -46,20 +50,31 @@ export function newStorage(prefix: string): IconStorage {
 }
 
 /**
- * Get storage for prefix
+ * Get storage for provider and prefix
  */
-export function getStorage(prefix: string): IconStorage {
-	if (storage[prefix] === void 0) {
-		storage[prefix] = newStorage(prefix);
+export function getStorage(provider: string, prefix: string): IconStorage {
+	if (storage[provider] === void 0) {
+		storage[provider] = Object.create(null);
 	}
-	return storage[prefix];
+	const providerStorage = storage[provider];
+	if (providerStorage[prefix] === void 0) {
+		providerStorage[prefix] = newStorage(provider, prefix);
+	}
+	return providerStorage[prefix];
+}
+
+/**
+ * Get all providers
+ */
+export function listStoredProviders(): string[] {
+	return Object.keys(storage);
 }
 
 /**
  * Get all prefixes
  */
-export function listStoredPrefixes(): string[] {
-	return Object.keys(storage);
+export function listStoredPrefixes(provider: string): string[] {
+	return storage[provider] === void 0 ? [] : Object.keys(storage[provider]);
 }
 
 /**
@@ -119,7 +134,7 @@ export function addIconSet(
 		// Check for missing icons list returned by API
 		if (data.not_found instanceof Array) {
 			const t = Date.now();
-			data.not_found.forEach(name => {
+			data.not_found.forEach((name) => {
 				storage.missing[name] = t;
 				if (list === 'all') {
 					added.push(name);
@@ -134,7 +149,7 @@ export function addIconSet(
 
 		// Get default values
 		const defaults = Object.create(null);
-		defaultsKeys.forEach(key => {
+		defaultsKeys.forEach((key) => {
 			if (data[key] !== void 0 && typeof data[key] !== 'object') {
 				defaults[key] = data[key];
 			}
@@ -142,7 +157,7 @@ export function addIconSet(
 
 		// Get icons
 		const icons = data.icons;
-		Object.keys(icons).forEach(name => {
+		Object.keys(icons).forEach((name) => {
 			const icon = icons[name];
 			if (typeof icon.body !== 'string') {
 				throw new Error('Invalid icon');
@@ -160,7 +175,7 @@ export function addIconSet(
 		// Get aliases
 		if (typeof data.aliases === 'object') {
 			const aliases = data.aliases;
-			Object.keys(aliases).forEach(name => {
+			Object.keys(aliases).forEach((name) => {
 				const icon = resolveAlias(aliases[name], icons, aliases, 1);
 				if (icon) {
 					// Freeze icon to make sure it will not be modified
diff --git a/packages/core/tests/10-basic/icon-name-test.ts b/packages/core/tests/10-basic/icon-name-test.ts
index 5dfa3a5..f7e9bef 100644
--- a/packages/core/tests/10-basic/icon-name-test.ts
+++ b/packages/core/tests/10-basic/icon-name-test.ts
@@ -7,12 +7,13 @@ import {
 } from '../../lib/icon/name';
 
 describe('Testing icon name', () => {
-	it('Converting and validating', () => {
+	it('Simple icon names', () => {
 		let icon;
 
 		// Simple prefix-name
 		icon = stringToIcon('fa-home') as IconifyIconName;
 		expect(icon).to.be.eql({
+			provider: '',
 			prefix: 'fa',
 			name: 'home',
 		});
@@ -21,6 +22,7 @@ describe('Testing icon name', () => {
 		// Simple prefix:name
 		icon = stringToIcon('fa:arrow-left') as IconifyIconName;
 		expect(icon).to.be.eql({
+			provider: '',
 			prefix: 'fa',
 			name: 'arrow-left',
 		});
@@ -29,11 +31,17 @@ describe('Testing icon name', () => {
 		// Longer prefix:name
 		icon = stringToIcon('mdi-light:home-outline') as IconifyIconName;
 		expect(icon).to.be.eql({
+			provider: '',
 			prefix: 'mdi-light',
 			name: 'home-outline',
 		});
 		expect(validateIcon(icon)).to.be.equal(true);
 
+		// Missing icon name
+		icon = stringToIcon('@iconify-home-icon');
+		expect(icon).to.be.eql(null);
+		expect(validateIcon(icon)).to.be.equal(false);
+
 		// Underscore is not an acceptable separator
 		icon = stringToIcon('fa_home');
 		expect(icon).to.be.eql(null);
@@ -42,19 +50,21 @@ describe('Testing icon name', () => {
 		// Invalid character '_': fail validateIcon
 		icon = stringToIcon('fa:home_outline') as IconifyIconName;
 		expect(icon).to.be.eql({
+			provider: '',
 			prefix: 'fa',
 			name: 'home_outline',
 		});
 		expect(validateIcon(icon)).to.be.equal(false);
 
 		// Too many colons: fail stringToIcon
-		icon = stringToIcon('mdi-light:home:outline');
+		icon = stringToIcon('mdi:light:home:outline');
 		expect(icon).to.be.eql(null);
 		expect(validateIcon(icon)).to.be.equal(false);
 
 		// Upper case: fail validateIcon
 		icon = stringToIcon('MD:Home') as IconifyIconName;
 		expect(icon).to.be.eql({
+			provider: '',
 			prefix: 'MD',
 			name: 'Home',
 		});
@@ -63,6 +73,7 @@ describe('Testing icon name', () => {
 		// Numbers: pass
 		icon = stringToIcon('1:foo') as IconifyIconName;
 		expect(icon).to.be.eql({
+			provider: '',
 			prefix: '1',
 			name: 'foo',
 		});
@@ -71,9 +82,68 @@ describe('Testing icon name', () => {
 		// Accented letters: fail validateIcon
 		icon = stringToIcon('md-fõö') as IconifyIconName;
 		expect(icon).to.be.eql({
+			provider: '',
 			prefix: 'md',
 			name: 'fõö',
 		});
 		expect(validateIcon(icon)).to.be.equal(false);
 	});
+
+	it('Providers', () => {
+		let icon;
+
+		// Simple @provider:prefix-name
+		icon = stringToIcon('@iconify:fa-home') as IconifyIconName;
+		expect(icon).to.be.eql({
+			provider: 'iconify',
+			prefix: 'fa',
+			name: 'home',
+		});
+		expect(validateIcon(icon)).to.be.equal(true);
+
+		// Simple @provider:prefix:name
+		icon = stringToIcon('@iconify:fa:arrow-left') as IconifyIconName;
+		expect(icon).to.be.eql({
+			provider: 'iconify',
+			prefix: 'fa',
+			name: 'arrow-left',
+		});
+		expect(validateIcon(icon)).to.be.equal(true);
+
+		// Longer @provider:prefix:name
+		icon = stringToIcon(
+			'@iconify-backup:mdi-light:home-outline'
+		) as IconifyIconName;
+		expect(icon).to.be.eql({
+			provider: 'iconify-backup',
+			prefix: 'mdi-light',
+			name: 'home-outline',
+		});
+		expect(validateIcon(icon)).to.be.equal(true);
+
+		// Missing @ for provider
+		icon = stringToIcon(
+			'iconify-backup:mdi-light:home-outline'
+		) as IconifyIconName;
+		expect(icon).to.be.eql({
+			provider: 'iconify-backup',
+			prefix: 'mdi-light',
+			name: 'home-outline',
+		});
+		expect(validateIcon(icon)).to.be.equal(true);
+
+		// Too many colons: fail stringToIcon
+		icon = stringToIcon('@mdi:light:home:outline');
+		expect(icon).to.be.eql(null);
+		expect(validateIcon(icon)).to.be.equal(false);
+
+		// Upper case: fail validateIcon
+		icon = stringToIcon('@MD:home-outline') as IconifyIconName;
+		expect(icon).to.be.eql({
+			provider: 'MD',
+			prefix: 'home',
+			name: 'outline',
+		});
+		expect(validateIcon(icon)).to.be.equal(false);
+	});
 });
diff --git a/packages/core/tests/10-basic/storage-test.ts b/packages/core/tests/10-basic/storage-test.ts
index 374c7ed..9e1310d 100644
--- a/packages/core/tests/10-basic/storage-test.ts
+++ b/packages/core/tests/10-basic/storage-test.ts
@@ -13,7 +13,7 @@ import { IconifyJSON } from '@iconify/types';
 
 describe('Testing storage', () => {
 	it('Adding icon', () => {
-		const storage = newStorage('foo');
+		const storage = newStorage('', 'foo');
 
 		// Add one icon
 		addIcon(storage, 'test', {
@@ -82,7 +82,7 @@ describe('Testing storage', () => {
 	});
 
 	it('Adding simple icon set', () => {
-		const storage = newStorage('foo');
+		const storage = newStorage('', 'foo');
 
 		// Add two icons
 		expect(
@@ -138,7 +138,7 @@ describe('Testing storage', () => {
 	});
 
 	it('Icon set with invalid default values', () => {
-		const storage = newStorage('foo');
+		const storage = newStorage('', 'foo');
 
 		// Missing prefix, invalid default values
 		expect(
@@ -205,7 +205,7 @@ describe('Testing storage', () => {
 	});
 
 	it('Icon set with simple aliases', () => {
-		const storage = newStorage('foo');
+		const storage = newStorage('', 'foo');
 
 		expect(
 			addIconSet(storage, {
@@ -275,7 +275,7 @@ describe('Testing storage', () => {
 	});
 
 	it('Icon set with nested aliases', () => {
-		const storage = newStorage('foo');
+		const storage = newStorage('', 'foo');
 
 		expect(
 			addIconSet(storage, {
@@ -402,7 +402,7 @@ describe('Testing storage', () => {
 	});
 
 	it('Icon set with aliases that use transformations', () => {
-		const storage = newStorage('arty-animated');
+		const storage = newStorage('iconify', 'arty-animated');
 		const iconBody =
 			'<g stroke="currentColor" stroke-width="16" stroke-linecap="round" stroke-linejoin="round" fill="none" fill-rule="evenodd"><path d="M40 64l48-48" class="animation-delay-0 animation-duration-10 animate-stroke stroke-length-102"/><path d="M40 64l48 48" class="animation-delay-0 animation-duration-10 animate-stroke stroke-length-102"/></g>';
 
diff --git a/packages/core/tests/30-api/10-callbacks-test.ts b/packages/core/tests/30-api/10-callbacks-test.ts
index d6fe48a..acebba3 100644
--- a/packages/core/tests/30-api/10-callbacks-test.ts
+++ b/packages/core/tests/30-api/10-callbacks-test.ts
@@ -18,11 +18,12 @@ describe('Testing API callbacks', () => {
 		return 'api-cb-test-' + (prefixCounter < 10 ? '0' : '') + prefixCounter;
 	}
 
-	it('Simple callback', done => {
+	it('Simple callback', (done) => {
+		const provider = 'iconify';
 		const prefix = nextPrefix();
 		let counter = 0;
 
-		const storage = getStorage(prefix);
+		const storage = getStorage(provider, prefix);
 		const abort = storeCallback(
 			(loaded, missing, pending, unsubscribe) => {
 				expect(unsubscribe).to.be.equal(abort);
@@ -33,23 +34,28 @@ describe('Testing API callbacks', () => {
 						// First run - icon1 should be loaded, icon3 should be missing
 						expect(loaded).to.be.eql([
 							{
+								provider,
 								prefix,
 								name: 'icon1',
 							},
 						]);
 						expect(missing).to.be.eql([
 							{
+								provider,
 								prefix,
 								name: 'icon3',
 							},
 						]);
 						expect(pending).to.be.eql([
 							{
+								provider,
 								prefix,
 								name: 'icon2',
 							},
 						]);
-						expect(callbacks[prefix].length).to.be.equal(1);
+						expect(callbacks[provider][prefix].length).to.be.equal(
+							1
+						);
 
 						// Add icon2 and trigger update
 						addIconSet(storage, {
@@ -61,54 +67,67 @@ describe('Testing API callbacks', () => {
 							},
 						});
 
-						updateCallbacks(prefix);
+						updateCallbacks(provider, prefix);
 						return;
 
 					case 2:
 						// Second run - icon2 should be added, completing callback
 						expect(loaded).to.be.eql([
 							{
+								provider,
 								prefix,
 								name: 'icon1',
 							},
 							{
+								provider,
 								prefix,
 								name: 'icon2',
 							},
 						]);
 						expect(missing).to.be.eql([
 							{
+								provider,
 								prefix,
 								name: 'icon3',
 							},
 						]);
 						expect(pending).to.be.eql([]);
-						expect(callbacks[prefix].length).to.be.equal(0);
+						expect(callbacks[provider][prefix].length).to.be.equal(
+							0
+						);
 						done();
 				}
 			},
 			sortIcons([
 				{
+					provider,
 					prefix,
 					name: 'icon1',
 				},
 				{
+					provider,
 					prefix,
 					name: 'icon2',
 				},
 				{
+					provider,
 					prefix,
 					name: 'icon3',
 				},
 			]),
-			[prefix]
+			[
+				{
+					provider,
+					prefix,
+				},
+			]
 		);
 
 		// Test callbacks
-		expect(callbacks[prefix].length).to.be.equal(1);
+		expect(callbacks[provider][prefix].length).to.be.equal(1);
 
 		// Test update - should do nothing
-		updateCallbacks(prefix);
+		updateCallbacks(provider, prefix);
 
 		// Wait for tick because updateCallbacks will use one
 		setTimeout(() => {
@@ -125,14 +144,15 @@ describe('Testing API callbacks', () => {
 				},
 				not_found: ['icon3'],
 			});
-			updateCallbacks(prefix);
+			updateCallbacks(provider, prefix);
 		});
 	});
 
 	it('Callback that should not be stored', () => {
+		const provider = '';
 		const prefix = nextPrefix();
 
-		const storage = getStorage(prefix);
+		const storage = getStorage(provider, prefix);
 		addIconSet(storage, {
 			prefix,
 			icons: {
@@ -152,30 +172,39 @@ describe('Testing API callbacks', () => {
 			},
 			sortIcons([
 				{
+					provider,
 					prefix,
 					name: 'icon1',
 				},
 				{
+					provider,
 					prefix,
 					name: 'icon2',
 				},
 				{
+					provider,
 					prefix,
 					name: 'icon3',
 				},
 			]),
-			[prefix]
+			[
+				{
+					provider,
+					prefix,
+				},
+			]
 		);
 
 		// callbacks should not have been initialised
 		expect(callbacks[prefix]).to.be.equal(void 0);
 	});
 
-	it('Cancel callback', done => {
+	it('Cancel callback', (done) => {
+		const provider = 'foo';
 		const prefix = nextPrefix();
 		let counter = 0;
 
-		const storage = getStorage(prefix);
+		const storage = getStorage(provider, prefix);
 		const abort = storeCallback(
 			(loaded, missing, pending, unsubscribe) => {
 				expect(unsubscribe).to.be.equal(abort);
@@ -186,23 +215,26 @@ describe('Testing API callbacks', () => {
 				// First run - icon1 should be loaded, icon3 should be missing
 				expect(loaded).to.be.eql([
 					{
+						provider,
 						prefix,
 						name: 'icon1',
 					},
 				]);
 				expect(missing).to.be.eql([
 					{
+						provider,
 						prefix,
 						name: 'icon3',
 					},
 				]);
 				expect(pending).to.be.eql([
 					{
+						provider,
 						prefix,
 						name: 'icon2',
 					},
 				]);
-				expect(callbacks[prefix].length).to.be.equal(1);
+				expect(callbacks[provider][prefix].length).to.be.equal(1);
 
 				// Add icon2 and trigger update
 				addIconSet(storage, {
@@ -214,35 +246,43 @@ describe('Testing API callbacks', () => {
 					},
 				});
 
-				updateCallbacks(prefix);
+				updateCallbacks(provider, prefix);
 
 				// Unsubscribe and set timer to call done()
 				unsubscribe();
-				expect(callbacks[prefix].length).to.be.equal(0);
+				expect(callbacks[provider][prefix].length).to.be.equal(0);
 				setTimeout(done);
 			},
 			sortIcons([
 				{
+					provider,
 					prefix,
 					name: 'icon1',
 				},
 				{
+					provider,
 					prefix,
 					name: 'icon2',
 				},
 				{
+					provider,
 					prefix,
 					name: 'icon3',
 				},
 			]),
-			[prefix]
+			[
+				{
+					provider,
+					prefix,
+				},
+			]
 		);
 
 		// Test callbacks
-		expect(callbacks[prefix].length).to.be.equal(1);
+		expect(callbacks[provider][prefix].length).to.be.equal(1);
 
 		// Test update - should do nothing
-		updateCallbacks(prefix);
+		updateCallbacks(provider, prefix);
 
 		// Wait for tick because updateCallbacks will use one
 		setTimeout(() => {
@@ -259,17 +299,18 @@ describe('Testing API callbacks', () => {
 				},
 				not_found: ['icon3'],
 			});
-			updateCallbacks(prefix);
+			updateCallbacks(provider, prefix);
 		});
 	});
 
-	it('Multiple prefixes', done => {
+	it('Multiple prefixes', (done) => {
+		const provider = '';
 		const prefix1 = nextPrefix();
 		const prefix2 = nextPrefix();
 		let counter = 0;
 
-		const storage1 = getStorage(prefix1);
-		const storage2 = getStorage(prefix2);
+		const storage1 = getStorage(provider, prefix1);
+		const storage2 = getStorage(provider, prefix2);
 
 		const abort = storeCallback(
 			(loaded, missing, pending, unsubscribe) => {
@@ -281,24 +322,31 @@ describe('Testing API callbacks', () => {
 						// First run - icon1 should be loaded, icon3 should be missing
 						expect(loaded).to.be.eql([
 							{
+								provider,
 								prefix: prefix1,
 								name: 'icon1',
 							},
 						]);
 						expect(missing).to.be.eql([
 							{
+								provider,
 								prefix: prefix1,
 								name: 'icon3',
 							},
 						]);
 						expect(pending).to.be.eql([
 							{
+								provider,
 								prefix: prefix2,
 								name: 'icon2',
 							},
 						]);
-						expect(callbacks[prefix1].length).to.be.equal(0);
-						expect(callbacks[prefix2].length).to.be.equal(1);
+						expect(callbacks[provider][prefix1].length).to.be.equal(
+							0
+						);
+						expect(callbacks[provider][prefix2].length).to.be.equal(
+							1
+						);
 
 						// Add icon2 and trigger update
 						addIconSet(storage2, {
@@ -310,13 +358,17 @@ describe('Testing API callbacks', () => {
 							},
 						});
 
-						updateCallbacks(prefix2);
+						updateCallbacks(provider, prefix2);
 						break;
 
 					case 2:
 						// Second run - icon2 should be loaded
-						expect(callbacks[prefix1].length).to.be.equal(0);
-						expect(callbacks[prefix2].length).to.be.equal(0);
+						expect(callbacks[provider][prefix1].length).to.be.equal(
+							0
+						);
+						expect(callbacks[provider][prefix2].length).to.be.equal(
+							0
+						);
 						done();
 						break;
 
@@ -326,27 +378,33 @@ describe('Testing API callbacks', () => {
 			},
 			sortIcons([
 				{
+					provider,
 					prefix: prefix1,
 					name: 'icon1',
 				},
 				{
+					provider,
 					prefix: prefix2,
 					name: 'icon2',
 				},
 				{
+					provider,
 					prefix: prefix1,
 					name: 'icon3',
 				},
 			]),
-			[prefix1, prefix2]
+			[
+				{ provider, prefix: prefix1 },
+				{ provider, prefix: prefix2 },
+			]
 		);
 
 		// Test callbacks
-		expect(callbacks[prefix1].length).to.be.equal(1);
-		expect(callbacks[prefix2].length).to.be.equal(1);
+		expect(callbacks[provider][prefix1].length).to.be.equal(1);
+		expect(callbacks[provider][prefix2].length).to.be.equal(1);
 
 		// Test update - should do nothing
-		updateCallbacks(prefix1);
+		updateCallbacks(provider, prefix1);
 
 		// Wait for tick because updateCallbacks will use one
 		setTimeout(() => {
@@ -363,7 +421,150 @@ describe('Testing API callbacks', () => {
 				},
 				not_found: ['icon3'],
 			});
-			updateCallbacks(prefix1);
+			updateCallbacks(provider, prefix1);
+		});
+	});
+
+	it('Multiple providers', (done) => {
+		const provider1 = nextPrefix();
+		const provider2 = nextPrefix();
+		const prefix1 = nextPrefix();
+		const prefix2 = nextPrefix();
+		let counter = 0;
+
+		const storage1 = getStorage(provider1, prefix1);
+		const storage2 = getStorage(provider2, prefix2);
+
+		const abort = storeCallback(
+			(loaded, missing, pending, unsubscribe) => {
+				expect(unsubscribe).to.be.equal(abort);
+
+				counter++;
+				switch (counter) {
+					case 1:
+						// First run - icon1 should be loaded, icon3 should be missing
+						expect(loaded).to.be.eql([
+							{
+								provider: provider1,
+								prefix: prefix1,
+								name: 'icon1',
+							},
+						]);
+						expect(missing).to.be.eql([
+							{
+								provider: provider1,
+								prefix: prefix1,
+								name: 'icon3',
+							},
+						]);
+						expect(pending).to.be.eql([
+							{
+								provider: provider2,
+								prefix: prefix2,
+								name: 'icon2',
+							},
+						]);
+						expect(
+							callbacks[provider1][prefix1].length
+						).to.be.equal(0);
+						expect(
+							callbacks[provider2][prefix2].length
+						).to.be.equal(1);
+
+						// Make sure providers/prefixes aren't mixed
+						expect(callbacks[provider1][prefix2]).to.be.equal(
+							void 0
+						);
+						expect(callbacks[provider2][prefix1]).to.be.equal(
+							void 0
+						);
+
+						// Add icon2 and trigger update
+						addIconSet(storage2, {
+							prefix: prefix2,
+							icons: {
+								icon2: {
+									body: '<g></g>',
+								},
+							},
+						});
+
+						updateCallbacks(provider2, prefix2);
+						break;
+
+					case 2:
+						// Second run - icon2 should be loaded
+						expect(
+							callbacks[provider1][prefix1].length
+						).to.be.equal(0);
+						expect(
+							callbacks[provider2][prefix2].length
+						).to.be.equal(0);
+
+						// Make sure providers/prefixes aren't mixed
+						expect(callbacks[provider1][prefix2]).to.be.equal(
+							void 0
+						);
+						expect(callbacks[provider2][prefix1]).to.be.equal(
+							void 0
+						);
+
+						done();
+						break;
+
+					default:
+						done('Callback was called ' + counter + ' times.');
+				}
+			},
+			sortIcons([
+				{
+					provider: provider1,
+					prefix: prefix1,
+					name: 'icon1',
+				},
+				{
+					provider: provider2,
+					prefix: prefix2,
+					name: 'icon2',
+				},
+				{
+					provider: provider1,
+					prefix: prefix1,
+					name: 'icon3',
+				},
+			]),
+			[
+				{ provider: provider1, prefix: prefix1 },
+				{ provider: provider2, prefix: prefix2 },
+			]
+		);
+
+		// Test callbacks
+		expect(callbacks[provider1][prefix1].length).to.be.equal(1);
+		expect(callbacks[provider2][prefix2].length).to.be.equal(1);
+
+		expect(callbacks[provider1][prefix2]).to.be.equal(void 0);
+		expect(callbacks[provider2][prefix1]).to.be.equal(void 0);
+
+		// Test update - should do nothing
+		updateCallbacks(provider1, prefix1);
+
+		// Wait for tick because updateCallbacks will use one
+		setTimeout(() => {
+			// Callback should not have been called yet
+			expect(counter).to.be.equal(0);
+
+			// Add few icons and run updateCallbacks
+			addIconSet(storage1, {
+				prefix: prefix1,
+				icons: {
+					icon1: {
+						body: '<g></g>',
+					},
+				},
+				not_found: ['icon3'],
+			});
+			updateCallbacks(provider1, prefix1);
 		});
 	});
 });
diff --git a/packages/core/tests/30-api/10-modules-test.ts b/packages/core/tests/30-api/10-modules-test.ts
index 38d52da..c62239e 100644
--- a/packages/core/tests/30-api/10-modules-test.ts
+++ b/packages/core/tests/30-api/10-modules-test.ts
@@ -9,7 +9,7 @@ import {
 	IconifyAPIConfig,
 } from '../../lib/api/config';
 import {
-	setAPIModule,
+	setProviderAPIModule,
 	APIQueryParams,
 	getAPIModule,
 	IconifyAPIModule,
@@ -25,10 +25,12 @@ describe('Testing API modules', () => {
 	}
 
 	const prepareQuery = (
+		provider: string,
 		prefix: string,
 		icons: string[]
 	): APIQueryParams[] => {
 		const item: APIQueryParams = {
+			provider,
 			prefix,
 			icons,
 		};
@@ -44,42 +46,36 @@ describe('Testing API modules', () => {
 	};
 
 	it('Empty module', () => {
-		const prefix = nextPrefix();
+		const provider = nextPrefix();
 
 		// Set config
-		setAPIConfig(
-			{
-				resources: ['https://localhost:3000'],
-				maxURL: 500,
-			},
-			prefix
-		);
+		setAPIConfig(provider, {
+			resources: ['https://localhost:3000'],
+			maxURL: 500,
+		});
 
 		// Set fake module
-		setAPIModule(
-			{
-				prepare: prepareQuery,
-				send: sendQuery,
-			},
-			prefix
-		);
+		setProviderAPIModule(provider, {
+			prepare: prepareQuery,
+			send: sendQuery,
+		});
 
 		// Get config
-		const config = getAPIConfig(prefix) as IconifyAPIConfig;
-		expect(config).to.not.be.equal(null);
+		const config = getAPIConfig(provider) as IconifyAPIConfig;
+		expect(config).to.not.be.equal(void 0);
 
 		// Check setAPIConfig
 		expect(config.resources).to.be.eql(['https://localhost:3000']);
 
 		// Check getAPIModule()
-		const item = getAPIModule(prefix) as IconifyAPIModule;
-		expect(item).to.not.be.equal(null);
+		const item = getAPIModule(provider) as IconifyAPIModule;
+		expect(item).to.not.be.equal(void 0);
 		expect(item.prepare).to.be.equal(prepareQuery);
 		expect(item.send).to.be.equal(sendQuery);
 
-		// Get module for different prefix to make sure it is empty
-		const prefix2 = nextPrefix();
-		const item2 = getAPIModule(prefix2);
-		expect(item2).to.be.equal(null);
+		// Get module for different provider to make sure it is empty
+		const provider2 = nextPrefix();
+		const item2 = getAPIModule(provider2);
+		expect(item2).to.be.equal(void 0);
 	});
 });
diff --git a/packages/core/tests/30-api/20-loading-test.ts b/packages/core/tests/30-api/20-loading-test.ts
index c6c6f09..3473683 100644
--- a/packages/core/tests/30-api/20-loading-test.ts
+++ b/packages/core/tests/30-api/20-loading-test.ts
@@ -3,8 +3,8 @@
 import 'mocha';
 import { expect } from 'chai';
 import { RedundancyPendingItem } from '@cyberalien/redundancy';
-import { setAPIConfig } from '../../lib/api/config';
-import { setAPIModule, APIQueryParams } from '../../lib/api/modules';
+import { setAPIConfig, IconifyAPIConfig } from '../../lib/api/config';
+import { setProviderAPIModule, APIQueryParams } from '../../lib/api/modules';
 import { API } from '../../lib/api/';
 
 describe('Testing API loadIcons', () => {
@@ -16,24 +16,24 @@ describe('Testing API loadIcons', () => {
 		);
 	}
 
-	it('Loading few icons', done => {
+	it('Loading few icons', (done) => {
+		const provider = nextPrefix();
 		const prefix = nextPrefix();
 		let asyncCounter = 0;
 
 		// Set config
-		setAPIConfig(
-			{
-				resources: ['https://api1.local', 'https://api2.local'],
-			},
-			prefix
-		);
+		setAPIConfig(provider, {
+			resources: ['https://api1.local', 'https://api2.local'],
+		});
 
 		// Icon loader
 		const prepareQuery = (
+			provider: string,
 			prefix: string,
 			icons: string[]
 		): APIQueryParams[] => {
 			const item: APIQueryParams = {
+				provider,
 				prefix,
 				icons,
 			};
@@ -44,6 +44,7 @@ describe('Testing API loadIcons', () => {
 
 			// Test input and return as one item
 			const expected: APIQueryParams = {
+				provider,
 				prefix,
 				icons: ['icon1', 'icon2'],
 			};
@@ -64,6 +65,7 @@ describe('Testing API loadIcons', () => {
 			// Test input
 			expect(host).to.be.equal('https://api1.local');
 			const expected: APIQueryParams = {
+				provider,
 				prefix,
 				icons: ['icon1', 'icon2'],
 			};
@@ -86,24 +88,22 @@ describe('Testing API loadIcons', () => {
 			expect(asyncCounter).to.be.equal(3);
 		};
 
-		setAPIModule(
-			{
-				prepare: prepareQuery,
-				send: sendQuery,
-			},
-			prefix
-		);
+		setProviderAPIModule(provider, {
+			prepare: prepareQuery,
+			send: sendQuery,
+		});
 
 		// Load icons
 		API.loadIcons(
 			[
 				// as icon
 				{
+					provider,
 					prefix,
 					name: 'icon1',
 				},
 				// as string
-				prefix + ':icon2',
+				provider + ':' + prefix + ':icon2',
 			],
 			(loaded, missing, pending, unsubscribe) => {
 				// This callback should be called last
@@ -112,10 +112,12 @@ describe('Testing API loadIcons', () => {
 
 				expect(loaded).to.be.eql([
 					{
+						provider,
 						prefix,
 						name: 'icon1',
 					},
 					{
+						provider,
 						prefix,
 						name: 'icon2',
 					},
@@ -123,42 +125,54 @@ describe('Testing API loadIcons', () => {
 				expect(missing).to.be.eql([]);
 				expect(pending).to.be.eql([]);
 
-				expect(API.isPending(prefix, 'icon1')).to.be.equal(false);
-				expect(API.isPending(prefix, 'icon3')).to.be.equal(false);
+				expect(
+					API.isPending({
+						provider,
+						prefix,
+						name: 'icon1',
+					})
+				).to.be.equal(false);
+				expect(
+					API.isPending({ provider, prefix, name: 'icon3' })
+				).to.be.equal(false);
 
 				done();
 			}
 		);
 
 		// Test isPending
-		expect(API.isPending(prefix, 'icon1')).to.be.equal(true);
-		expect(API.isPending(prefix, 'icon3')).to.be.equal(false);
+		expect(API.isPending({ provider, prefix, name: 'icon1' })).to.be.equal(
+			true
+		);
+		expect(API.isPending({ provider, prefix, name: 'icon3' })).to.be.equal(
+			false
+		);
 
 		// Make sure asyncCounter wasn't increased because loading shoud happen on next tick
 		expect(asyncCounter).to.be.equal(0);
 		asyncCounter++;
 	});
 
-	it('Split results', done => {
+	it('Split results', (done) => {
+		const provider = nextPrefix();
 		const prefix = nextPrefix();
 
 		// Set config
-		setAPIConfig(
-			{
-				resources: ['https://api1.local', 'https://api2.local'],
-			},
-			prefix
-		);
+		setAPIConfig(provider, {
+			resources: ['https://api1.local', 'https://api2.local'],
+		});
 
 		// Icon loader
 		const prepareQuery = (
+			provider: string,
 			prefix: string,
 			icons: string[]
 		): APIQueryParams[] => {
 			// Split all icons in multiple queries, one icon per query
 			const results: APIQueryParams[] = [];
-			icons.forEach(icon => {
+			icons.forEach((icon) => {
 				const item: APIQueryParams = {
+					provider,
 					prefix,
 					icons: [icon],
 				};
@@ -182,6 +196,7 @@ describe('Testing API loadIcons', () => {
 			// Icon names should match queryCounter: 'icon1' on first run, 'icon2' on second run
 			queryCounter++;
 			const expected: APIQueryParams = {
+				provider,
 				prefix,
 				icons: ['icon' + queryCounter],
 			};
@@ -189,7 +204,7 @@ describe('Testing API loadIcons', () => {
 
 			// Send only requested icons
 			const icons = Object.create(null);
-			params.icons.forEach(icon => {
+			params.icons.forEach((icon) => {
 				icons[icon] = {
 					body: '<path d="" />',
 				};
@@ -200,18 +215,18 @@ describe('Testing API loadIcons', () => {
 			});
 		};
 
-		setAPIModule(
-			{
-				prepare: prepareQuery,
-				send: sendQuery,
-			},
-			prefix
-		);
+		setProviderAPIModule(provider, {
+			prepare: prepareQuery,
+			send: sendQuery,
+		});
 
 		// Load icons
 		let callbackCalled = false;
 		API.loadIcons(
-			[prefix + ':icon1', prefix + ':icon2'],
+			[
+				provider + ':' + prefix + ':icon1',
+				provider + ':' + prefix + ':icon2',
+			],
 			(loaded, missing, pending, unsubscribe) => {
 				// Callback should be called only once because results should be sent in same tick
 				expect(callbackCalled).to.be.equal(false);
@@ -220,10 +235,12 @@ describe('Testing API loadIcons', () => {
 				// Test data
 				expect(loaded).to.be.eql([
 					{
+						provider,
 						prefix,
 						name: 'icon1',
 					},
 					{
+						provider,
 						prefix,
 						name: 'icon2',
 					},
@@ -235,24 +252,24 @@ describe('Testing API loadIcons', () => {
 		);
 	});
 
-	it('Fail on default host', done => {
+	it('Fail on default host', (done) => {
+		const provider = nextPrefix();
 		const prefix = nextPrefix();
 
 		// Set config
-		setAPIConfig(
-			{
-				resources: ['https://api1.local', 'https://api2.local'],
-				rotate: 100, // 100ms to speed up test
-			},
-			prefix
-		);
+		setAPIConfig(provider, {
+			resources: ['https://api1.local', 'https://api2.local'],
+			rotate: 100, // 100ms to speed up test
+		});
 
 		// Icon loader
 		const prepareQuery = (
+			provider: string,
 			prefix: string,
 			icons: string[]
 		): APIQueryParams[] => {
 			const item: APIQueryParams = {
+				provider,
 				prefix,
 				icons,
 			};
@@ -299,18 +316,18 @@ describe('Testing API loadIcons', () => {
 			}
 		};
 
-		setAPIModule(
-			{
-				prepare: prepareQuery,
-				send: sendQuery,
-			},
-			prefix
-		);
+		setProviderAPIModule(provider, {
+			prepare: prepareQuery,
+			send: sendQuery,
+		});
 
 		// Load icons
 		let callbackCalled = false;
 		API.loadIcons(
-			[prefix + ':icon1', prefix + ':icon2'],
+			[
+				provider + ':' + prefix + ':icon1',
+				provider + ':' + prefix + ':icon2',
+			],
 			(loaded, missing, pending, unsubscribe) => {
 				// Callback should be called only once
 				expect(callbackCalled).to.be.equal(false);
@@ -319,10 +336,12 @@ describe('Testing API loadIcons', () => {
 				// Test data
 				expect(loaded).to.be.eql([
 					{
+						provider,
 						prefix,
 						name: 'icon1',
 					},
 					{
+						provider,
 						prefix,
 						name: 'icon2',
 					},
@@ -335,24 +354,24 @@ describe('Testing API loadIcons', () => {
 		);
 	});
 
-	it('Fail on default host, multiple queries', done => {
+	it('Fail on default host, multiple queries', (done) => {
+		const provider = nextPrefix();
 		const prefix = nextPrefix();
 
 		// Set config
-		setAPIConfig(
-			{
-				resources: ['https://api1.local', 'https://api2.local'],
-				rotate: 100, // 100ms to speed up test
-			},
-			prefix
-		);
+		setAPIConfig(provider, {
+			resources: ['https://api1.local', 'https://api2.local'],
+			rotate: 100, // 100ms to speed up test
+		});
 
 		// Icon loader
 		const prepareQuery = (
+			provider: string,
 			prefix: string,
 			icons: string[]
 		): APIQueryParams[] => {
 			const item: APIQueryParams = {
+				provider,
 				prefix,
 				icons,
 			};
@@ -420,18 +439,18 @@ describe('Testing API loadIcons', () => {
 			}
 		};
 
-		setAPIModule(
-			{
-				prepare: prepareQuery,
-				send: sendQuery,
-			},
-			prefix
-		);
+		setProviderAPIModule(provider, {
+			prepare: prepareQuery,
+			send: sendQuery,
+		});
 
 		// Load icons
 		let callbackCalled = false;
 		API.loadIcons(
-			[prefix + ':icon1', prefix + ':icon2'],
+			[
+				provider + ':' + prefix + ':icon1',
+				provider + ':' + prefix + ':icon2',
+			],
 			(loaded, missing, pending, unsubscribe) => {
 				// Callback should be called only once
 				expect(callbackCalled).to.be.equal(false);
@@ -440,10 +459,12 @@ describe('Testing API loadIcons', () => {
 				// Test data
 				expect(loaded).to.be.eql([
 					{
+						provider,
 						prefix,
 						name: 'icon1',
 					},
 					{
+						provider,
 						prefix,
 						name: 'icon2',
 					},
@@ -455,7 +476,10 @@ describe('Testing API loadIcons', () => {
 				setTimeout(() => {
 					let callbackCalled = false;
 					API.loadIcons(
-						[prefix + ':icon3', prefix + ':icon4'],
+						[
+							provider + ':' + prefix + ':icon3',
+							provider + ':' + prefix + ':icon4',
+						],
 						(loaded, missing, pending, unsubscribe) => {
 							// Callback should be called only once
 							expect(callbackCalled).to.be.equal(false);
@@ -464,10 +488,12 @@ describe('Testing API loadIcons', () => {
 							// Test data
 							expect(loaded).to.be.eql([
 								{
+									provider,
 									prefix,
 									name: 'icon3',
 								},
 								{
+									provider,
 									prefix,
 									name: 'icon4',
 								},
@@ -483,25 +509,25 @@ describe('Testing API loadIcons', () => {
 		);
 	});
 
-	it('Fail on default host, multiple queries with different prefixes', done => {
+	it('Fail on default host, multiple queries with different prefixes', (done) => {
+		const provider = nextPrefix();
 		const prefix = nextPrefix();
 		const prefix2 = nextPrefix();
 
 		// Set config
-		setAPIConfig(
-			{
-				resources: ['https://api1.local', 'https://api2.local'],
-				rotate: 100, // 100ms to speed up test
-			},
-			[prefix, prefix2]
-		);
+		setAPIConfig(provider, {
+			resources: ['https://api1.local', 'https://api2.local'],
+			rotate: 100, // 100ms to speed up test
+		});
 
 		// Icon loader
 		const prepareQuery = (
+			provider: string,
 			prefix: string,
 			icons: string[]
 		): APIQueryParams[] => {
 			const item: APIQueryParams = {
+				provider,
 				prefix,
 				icons,
 			};
@@ -572,18 +598,18 @@ describe('Testing API loadIcons', () => {
 			}
 		};
 
-		setAPIModule(
-			{
-				prepare: prepareQuery,
-				send: sendQuery,
-			},
-			[prefix, prefix2]
-		);
+		setProviderAPIModule(provider, {
+			prepare: prepareQuery,
+			send: sendQuery,
+		});
 
 		// Load icons
 		let callbackCalled = false;
 		API.loadIcons(
-			[prefix + ':icon1', prefix + ':icon2'],
+			[
+				provider + ':' + prefix + ':icon1',
+				provider + ':' + prefix + ':icon2',
+			],
 			(loaded, missing, pending, unsubscribe) => {
 				// Callback should be called only once
 				expect(callbackCalled).to.be.equal(false);
@@ -592,10 +618,12 @@ describe('Testing API loadIcons', () => {
 				// Test data
 				expect(loaded).to.be.eql([
 					{
+						provider,
 						prefix,
 						name: 'icon1',
 					},
 					{
+						provider,
 						prefix,
 						name: 'icon2',
 					},
@@ -607,7 +635,10 @@ describe('Testing API loadIcons', () => {
 				setTimeout(() => {
 					let callbackCalled = false;
 					API.loadIcons(
-						[prefix2 + ':icon2', prefix2 + ':icon4'],
+						[
+							provider + ':' + prefix2 + ':icon2',
+							provider + ':' + prefix2 + ':icon4',
+						],
 						(loaded, missing, pending, unsubscribe) => {
 							// Callback should be called only once
 							expect(callbackCalled).to.be.equal(false);
@@ -616,10 +647,12 @@ describe('Testing API loadIcons', () => {
 							// Test data
 							expect(loaded).to.be.eql([
 								{
+									provider,
 									prefix: prefix2,
 									name: 'icon2',
 								},
 								{
+									provider,
 									prefix: prefix2,
 									name: 'icon4',
 								},
diff --git a/packages/core/tests/30-cache/10-basic-test.ts b/packages/core/tests/30-cache/10-basic-test.ts
index e35c01a..75fbaf8 100644
--- a/packages/core/tests/30-cache/10-basic-test.ts
+++ b/packages/core/tests/30-cache/10-basic-test.ts
@@ -14,6 +14,8 @@ import {
 } from './fake_cache';
 
 describe('Testing mocked localStorage', () => {
+	const provider = '';
+
 	it('No usable cache', () => {
 		reset({});
 
@@ -85,6 +87,7 @@ describe('Testing mocked localStorage', () => {
 			cachePrefix + '0',
 			JSON.stringify({
 				cached: Date.now(),
+				provider,
 				data: {
 					prefix: prefix,
 					icons: {
@@ -143,6 +146,7 @@ describe('Testing mocked localStorage', () => {
 			cachePrefix + '0',
 			JSON.stringify({
 				cached: Date.now(),
+				provider,
 				data: {
 					prefix: prefix,
 					icons: {
diff --git a/packages/core/tests/30-cache/20-loading-test.ts b/packages/core/tests/30-cache/20-loading-test.ts
index edf61d2..2cfaba0 100644
--- a/packages/core/tests/30-cache/20-loading-test.ts
+++ b/packages/core/tests/30-cache/20-loading-test.ts
@@ -24,6 +24,8 @@ import {
 import { IconifyIcon, IconifyJSON } from '@iconify/types';
 
 describe('Testing loading from localStorage', () => {
+	const provider = '';
+
 	it('Valid icon set', () => {
 		const prefix = nextPrefix();
 		const cache = createCache();
@@ -34,6 +36,7 @@ describe('Testing loading from localStorage', () => {
 
 		const item: StoredItem = {
 			cached: Math.floor(Date.now() / hour),
+			provider,
 			data: {
 				prefix: prefix,
 				icons: {
@@ -51,7 +54,7 @@ describe('Testing loading from localStorage', () => {
 		});
 
 		// Check icon storage
-		const icons = getStorage(prefix);
+		const icons = getStorage(provider, prefix);
 		expect(iconExists(icons, 'foo')).to.be.equal(false);
 
 		// Load localStorage
@@ -75,6 +78,64 @@ describe('Testing loading from localStorage', () => {
 		});
 	});
 
+	it('Different provider', () => {
+		const provider = nextPrefix();
+		const prefix = nextPrefix();
+		const cache = createCache();
+
+		// Add one icon set
+		cache.setItem(versionKey, cacheVersion);
+		cache.setItem(countKey, '1');
+
+		const item: StoredItem = {
+			cached: Math.floor(Date.now() / hour),
+			provider,
+			data: {
+				prefix: prefix,
+				icons: {
+					foo: {
+						body: '<g></g>',
+					},
+				},
+			},
+		};
+		cache.setItem(cachePrefix + '0', JSON.stringify(item));
+
+		// Set cache
+		reset({
+			localStorage: cache,
+		});
+
+		// Check icon storage
+		const icons = getStorage(provider, prefix);
+		expect(iconExists(icons, 'foo')).to.be.equal(false);
+
+		// Check default provider
+		const icons2 = getStorage('', prefix);
+		expect(iconExists(icons2, 'foo')).to.be.equal(false);
+
+		// Load localStorage
+		loadCache();
+
+		// Icon should exist now
+		expect(iconExists(icons, 'foo')).to.be.equal(true);
+		expect(iconExists(icons2, 'foo')).to.be.equal(false);
+
+		// Check data
+		expect(config).to.be.eql({
+			local: true,
+			session: false,
+		});
+		expect(count).to.be.eql({
+			local: 1,
+			session: 0,
+		});
+		expect(emptyList).to.be.eql({
+			local: [],
+			session: [],
+		});
+	});
+
 	it('Expired icon set', () => {
 		const prefix = nextPrefix();
 		const cache = createCache();
@@ -86,6 +147,7 @@ describe('Testing loading from localStorage', () => {
 		const item: StoredItem = {
 			// Expiration date
 			cached: Math.floor(Date.now() / hour) - cacheExpiration - 1,
+			provider,
 			data: {
 				prefix: prefix,
 				icons: {
@@ -103,7 +165,7 @@ describe('Testing loading from localStorage', () => {
 		});
 
 		// Check icon storage
-		const icons = getStorage(prefix);
+		const icons = getStorage(provider, prefix);
 		expect(iconExists(icons, 'foo')).to.be.equal(false);
 
 		// Load localStorage
@@ -138,6 +200,7 @@ describe('Testing loading from localStorage', () => {
 			cachePrefix + '0',
 			JSON.stringify({
 				cached: Math.floor(Date.now() / hour),
+				provider,
 				data: {
 					prefix: prefix,
 					icons: {
@@ -156,7 +219,7 @@ describe('Testing loading from localStorage', () => {
 		});
 
 		// Check icon storage
-		const icons = getStorage(prefix);
+		const icons = getStorage(provider, prefix);
 		expect(iconExists(icons, 'foo')).to.be.equal(false);
 
 		// Load localStorage
@@ -190,6 +253,7 @@ describe('Testing loading from localStorage', () => {
 
 		const item: StoredItem = {
 			cached: Math.floor(Date.now() / hour),
+			provider,
 			data: {
 				prefix: prefix,
 				icons: {
@@ -207,7 +271,7 @@ describe('Testing loading from localStorage', () => {
 		});
 
 		// Check icon storage
-		const icons = getStorage(prefix);
+		const icons = getStorage(provider, prefix);
 		expect(iconExists(icons, 'foo')).to.be.equal(false);
 
 		// Load localStorage
@@ -241,6 +305,7 @@ describe('Testing loading from localStorage', () => {
 
 		const item: StoredItem = {
 			cached: Math.floor(Date.now() / hour),
+			provider,
 			data: {
 				prefix: prefix,
 				icons: {
@@ -258,7 +323,7 @@ describe('Testing loading from localStorage', () => {
 		});
 
 		// Check icon storage
-		const icons = getStorage(prefix);
+		const icons = getStorage(provider, prefix);
 		expect(iconExists(icons, 'foo')).to.be.equal(false);
 
 		// Load localStorage
@@ -293,6 +358,7 @@ describe('Testing loading from localStorage', () => {
 		// Missing: 0, 2, 3
 		const item1: StoredItem = {
 			cached: Math.floor(Date.now() / hour),
+			provider,
 			data: {
 				prefix: prefix,
 				icons: {
@@ -304,6 +370,7 @@ describe('Testing loading from localStorage', () => {
 		};
 		const item4: StoredItem = {
 			cached: Math.floor(Date.now() / hour),
+			provider,
 			data: {
 				prefix: prefix,
 				icons: {
@@ -323,7 +390,7 @@ describe('Testing loading from localStorage', () => {
 		});
 
 		// Check icon storage
-		const icons = getStorage(prefix);
+		const icons = getStorage(provider, prefix);
 		expect(iconExists(icons, 'foo1')).to.be.equal(false);
 		expect(iconExists(icons, 'foo4')).to.be.equal(false);
 
@@ -376,6 +443,7 @@ describe('Testing loading from localStorage', () => {
 			};
 			const item: StoredItem = {
 				cached: Math.floor(Date.now() / hour),
+				provider,
 				data: icon,
 			};
 			icons.push(icon);
@@ -399,7 +467,7 @@ describe('Testing loading from localStorage', () => {
 		});
 
 		// Check icon storage
-		const iconsStorage = getStorage(prefix);
+		const iconsStorage = getStorage(provider, prefix);
 		for (let i = 0; i < 6; i++) {
 			expect(iconExists(iconsStorage, 'foo' + i)).to.be.equal(
 				false,
diff --git a/packages/core/tests/30-cache/30-saving-test.ts b/packages/core/tests/30-cache/30-saving-test.ts
index f52d962..12a5ccb 100644
--- a/packages/core/tests/30-cache/30-saving-test.ts
+++ b/packages/core/tests/30-cache/30-saving-test.ts
@@ -25,6 +25,8 @@ import {
 import { IconifyJSON } from '@iconify/types';
 
 describe('Testing saving to localStorage', () => {
+	const provider = '';
+
 	it('One icon set', () => {
 		const prefix = nextPrefix();
 		const cache = createCache();
@@ -40,6 +42,7 @@ describe('Testing saving to localStorage', () => {
 		};
 		const item: StoredItem = {
 			cached: Math.floor(Date.now() / hour),
+			provider,
 			data: icon,
 		};
 
@@ -49,11 +52,11 @@ describe('Testing saving to localStorage', () => {
 		});
 
 		// Check icon storage
-		const icons = getStorage(prefix);
+		const icons = getStorage(provider, prefix);
 		expect(iconExists(icons, 'foo')).to.be.equal(false);
 
 		// Save item
-		storeCache(icon);
+		storeCache(provider, icon);
 
 		// Storing in cache should not add item to storage
 		expect(iconExists(icons, 'foo')).to.be.equal(false);
@@ -96,6 +99,7 @@ describe('Testing saving to localStorage', () => {
 		};
 		const item0: StoredItem = {
 			cached: Math.floor(Date.now() / hour),
+			provider,
 			data: icon0,
 		};
 		const icon1: IconifyJSON = {
@@ -108,6 +112,7 @@ describe('Testing saving to localStorage', () => {
 		};
 		const item1: StoredItem = {
 			cached: Math.floor(Date.now() / hour),
+			provider,
 			data: icon1,
 		};
 
@@ -117,8 +122,8 @@ describe('Testing saving to localStorage', () => {
 		});
 
 		// Save items
-		storeCache(icon0);
-		storeCache(icon1);
+		storeCache(provider, icon0);
+		storeCache(provider, icon1);
 
 		// Check data that should have been updated because storeCache()
 		// should call load function before first execution
@@ -161,6 +166,7 @@ describe('Testing saving to localStorage', () => {
 		};
 		const item0: StoredItem = {
 			cached: Math.floor(Date.now() / hour),
+			provider,
 			data: icon0,
 		};
 		const icon1: IconifyJSON = {
@@ -173,6 +179,7 @@ describe('Testing saving to localStorage', () => {
 		};
 		const item1: StoredItem = {
 			cached: Math.floor(Date.now() / hour),
+			provider,
 			data: icon1,
 		};
 
@@ -204,7 +211,7 @@ describe('Testing saving to localStorage', () => {
 		});
 
 		// Save items
-		storeCache(icon0);
+		storeCache(provider, icon0);
 
 		// Check data
 		expect(count).to.be.eql({
@@ -245,6 +252,7 @@ describe('Testing saving to localStorage', () => {
 			};
 			const item: StoredItem = {
 				cached: Math.floor(Date.now() / hour),
+				provider,
 				data: icon,
 			};
 
@@ -313,7 +321,7 @@ describe('Testing saving to localStorage', () => {
 		});
 
 		// Add item 5
-		storeCache(icons[5]);
+		storeCache(provider, icons[5]);
 		expect(count).to.be.eql({
 			local: 0,
 			session: 9,
@@ -328,7 +336,7 @@ describe('Testing saving to localStorage', () => {
 		const list = [4, 2, 1];
 		list.slice(0).forEach((index) => {
 			expect(list.shift()).to.be.equal(index);
-			storeCache(icons[index]);
+			storeCache(provider, icons[index]);
 			expect(count).to.be.eql({
 				local: 0,
 				session: 9,
@@ -341,7 +349,7 @@ describe('Testing saving to localStorage', () => {
 		});
 
 		// Add item 10
-		storeCache(icons[10]);
+		storeCache(provider, icons[10]);
 		expect(count).to.be.eql({
 			local: 0,
 			session: 10,
@@ -353,7 +361,7 @@ describe('Testing saving to localStorage', () => {
 		expect(cache.getItem(countKey)).to.be.equal('10');
 
 		// Add item 11
-		storeCache(icons[11]);
+		storeCache(provider, icons[11]);
 		expect(count).to.be.eql({
 			local: 0,
 			session: 11,
@@ -392,7 +400,7 @@ describe('Testing saving to localStorage', () => {
 		});
 
 		// Check icon storage
-		const icons = getStorage(prefix);
+		const icons = getStorage(provider, prefix);
 		expect(iconExists(icons, 'foo1')).to.be.equal(false);
 
 		// Load cache
@@ -422,11 +430,12 @@ describe('Testing saving to localStorage', () => {
 		};
 		const item: StoredItem = {
 			cached: Math.floor(Date.now() / hour),
+			provider,
 			data: icon,
 		};
 
 		// Save item
-		storeCache(icon);
+		storeCache(provider, icon);
 
 		// Storing in cache should not add item to storage
 		expect(iconExists(icons, 'foo')).to.be.equal(false);
@@ -473,6 +482,7 @@ describe('Testing saving to localStorage', () => {
 			};
 			const item: StoredItem = {
 				cached: Math.floor(Date.now() / hour),
+				provider,
 				data: icon,
 			};
 			cache1.setItem(cachePrefix + index, JSON.stringify(item));
@@ -492,6 +502,7 @@ describe('Testing saving to localStorage', () => {
 			};
 			const item: StoredItem = {
 				cached: Math.floor(Date.now() / hour),
+				provider,
 				data: icon,
 			};
 			cache2.setItem(cachePrefix + index, JSON.stringify(item));
@@ -521,7 +532,7 @@ describe('Testing saving to localStorage', () => {
 		});
 
 		// Check icon storage
-		const iconsStorage = getStorage(prefix);
+		const iconsStorage = getStorage(provider, prefix);
 		for (let i = 0; i < count.local; i++) {
 			expect(iconExists(iconsStorage, 'foo' + i)).to.be.equal(
 				true,
@@ -546,9 +557,10 @@ describe('Testing saving to localStorage', () => {
 		};
 		const item: StoredItem = {
 			cached: Math.floor(Date.now() / hour),
+			provider,
 			data: icon,
 		};
-		storeCache(icon);
+		storeCache(provider, icon);
 
 		// Check data
 		expect(count).to.be.eql({
@@ -585,6 +597,7 @@ describe('Testing saving to localStorage', () => {
 			};
 			const item: StoredItem = {
 				cached: Math.floor(Date.now() / hour),
+				provider,
 				data: icon,
 			};
 			cache1.setItem(cachePrefix + index, JSON.stringify(item));
@@ -604,6 +617,7 @@ describe('Testing saving to localStorage', () => {
 			};
 			const item: StoredItem = {
 				cached: Math.floor(Date.now() / hour),
+				provider,
 				data: icon,
 			};
 			cache2.setItem(cachePrefix + index, JSON.stringify(item));
@@ -633,7 +647,7 @@ describe('Testing saving to localStorage', () => {
 		});
 
 		// Check icon storage
-		const iconsStorage = getStorage(prefix);
+		const iconsStorage = getStorage(provider, prefix);
 		for (let i = 0; i < count.local; i++) {
 			expect(iconExists(iconsStorage, 'foo' + i)).to.be.equal(
 				true,
@@ -661,9 +675,10 @@ describe('Testing saving to localStorage', () => {
 		};
 		const item: StoredItem = {
 			cached: Math.floor(Date.now() / hour),
+			provider,
 			data: icon,
 		};
-		storeCache(icon);
+		storeCache(provider, icon);
 
 		// Check data
 		expect(count).to.be.eql({
diff --git a/packages/core/tests/30-cache/fake_cache.ts b/packages/core/tests/30-cache/fake_cache.ts
index 2a81519..796022c 100644
--- a/packages/core/tests/30-cache/fake_cache.ts
+++ b/packages/core/tests/30-cache/fake_cache.ts
@@ -9,7 +9,7 @@ export function nextPrefix(): string {
 }
 
 // Cache version. Bump when structure changes
-export const cacheVersion = 'iconify1';
+export const cacheVersion = 'iconify2';
 
 // Cache keys
 export const cachePrefix = 'iconify';
diff --git a/packages/iconify/src/iconify.ts b/packages/iconify/src/iconify.ts
index 0d3fe41..a571189 100644
--- a/packages/iconify/src/iconify.ts
+++ b/packages/iconify/src/iconify.ts
@@ -19,6 +19,7 @@ import {
 	getIcon,
 	addIcon,
 	addIconSet,
+	listStoredProviders,
 	listStoredPrefixes,
 } from '@iconify/core/lib/storage';
 import { iconToSVG, IconifyIconBuildResult } from '@iconify/core/lib/builder';
@@ -39,7 +40,7 @@ import { storeCache, loadCache, config } from '@iconify/core/lib/cache/storage';
 
 // API
 import { API } from '@iconify/core/lib/api/';
-import { setAPIModule } from '@iconify/core/lib/api/modules';
+import { setDefaultAPIModule } from '@iconify/core/lib/api/modules';
 import { setAPIConfig, IconifyAPIConfig } from '@iconify/core/lib/api/config';
 import { prepareQuery, sendQuery } from './modules/api-jsonp';
 import {
@@ -105,7 +106,7 @@ export interface IconifyGlobal {
 	/**
 	 * List all available icons
 	 */
-	listIcons: (prefix?: string) => string[];
+	listIcons: (provider?: string, prefix?: string) => string[];
 
 	/**
 	 * Load icons
@@ -157,7 +158,7 @@ export interface IconifyGlobal {
 	/**
 	 * Add icon set to storage
 	 */
-	addCollection: (data: IconifyJSON) => boolean;
+	addCollection: (data: IconifyJSON, provider?: string) => boolean;
 
 	/* API stuff */
 	/**
@@ -174,8 +175,8 @@ export interface IconifyGlobal {
 	 * Set API configuration
 	 */
 	setAPIConfig: (
-		customConfig: Partial<IconifyAPIConfig>,
-		prefix?: string | string[]
+		provider: string,
+		customConfig: Partial<IconifyAPIConfig>
 	) => void;
 
 	/* Scan DOM */
@@ -211,7 +212,9 @@ function getIconName(name: string): IconifyIconName | null {
  */
 function getIconData(name: string): FullIconifyIcon | null {
 	const icon = getIconName(name);
-	return icon ? getIcon(getStorage(icon.prefix), icon.name) : null;
+	return icon
+		? getIcon(getStorage(icon.provider, icon.prefix), icon.name)
+		: null;
 }
 
 /**
@@ -282,23 +285,38 @@ const Iconify: IconifyGlobal = {
 	},
 
 	// List icons
-	listIcons: (prefix?: string) => {
+	listIcons: (provider?: string, prefix?: string) => {
 		let icons = [];
 
-		let prefixes = listStoredPrefixes();
-		let addPrefix = true;
-		if (typeof prefix === 'string') {
-			prefixes = prefixes.indexOf(prefix) !== -1 ? [] : [prefix];
-			addPrefix = false;
+		// Get providers
+		let providers: string[];
+		if (typeof provider === 'string') {
+			providers = [provider];
+		} else {
+			providers = listStoredProviders();
 		}
 
-		prefixes.forEach((prefix) => {
-			const storage = getStorage(prefix);
-			let icons = Object.keys(storage.icons);
-			if (addPrefix) {
-				icons = icons.map((name) => prefix + ':' + name);
+		// Get all icons
+		providers.forEach((provider) => {
+			let prefixes: string[];
+
+			if (typeof prefix === 'string') {
+				prefixes = [prefix];
+			} else {
+				prefixes = listStoredPrefixes(provider);
 			}
-			icons = icons.concat(icons);
+
+			prefixes.forEach((prefix) => {
+				const storage = getStorage(provider, prefix);
+				let icons = Object.keys(storage.icons).map(
+					(name) =>
+						(provider !== '' ? '@' + provider + ':' : '') +
+						prefix +
+						':' +
+						name
+				);
+				icons = icons.concat(icons);
+			});
 		});
 
 		return icons;
@@ -331,16 +349,21 @@ const Iconify: IconifyGlobal = {
 		if (!icon) {
 			return false;
 		}
-		const storage = getStorage(icon.prefix);
+		const storage = getStorage(icon.provider, icon.prefix);
 		return addIcon(storage, icon.name, data);
 	},
 
 	// Add icon set
-	addCollection: (data) => {
+	addCollection: (data, provider?: string) => {
+		if (typeof provider !== 'string') {
+			provider = '';
+		}
+
 		if (
 			typeof data !== 'object' ||
 			typeof data.prefix !== 'string' ||
 			!validateIcon({
+				provider,
 				prefix: data.prefix,
 				name: 'a',
 			})
@@ -348,7 +371,7 @@ const Iconify: IconifyGlobal = {
 			return false;
 		}
 
-		const storage = getStorage(data.prefix);
+		const storage = getStorage(provider, data.prefix);
 		return !!addIconSet(storage, data);
 	},
 
@@ -404,11 +427,11 @@ coreModules.cache = storeCache;
 loadCache();
 
 // Set API
-setAPIModule({
+coreModules.api = API;
+setDefaultAPIModule({
 	send: sendQuery,
 	prepare: prepareQuery,
 });
-coreModules.api = API;
 
 // Load observer
 browserModules.observer = observer;
diff --git a/packages/iconify/src/modules/api-jsonp.ts b/packages/iconify/src/modules/api-jsonp.ts
index c0a1a7e..aaeb898 100644
--- a/packages/iconify/src/modules/api-jsonp.ts
+++ b/packages/iconify/src/modules/api-jsonp.ts
@@ -84,9 +84,9 @@ function getGlobal(): JSONPRoot {
 /**
  * Calculate maximum icons list length for prefix
  */
-function calculateMaxLength(prefix: string): number {
+function calculateMaxLength(provider: string, prefix: string): number {
 	// Get config and store path
-	const config = getAPIConfig(prefix);
+	const config = getAPIConfig(provider);
 	if (!config) {
 		return 0;
 	}
@@ -112,7 +112,10 @@ function calculateMaxLength(prefix: string): number {
 			config.maxURL -
 			maxHostLength -
 			config.path.length -
-			endPoint.replace('{prefix}', prefix).replace('{icons}', '').length -
+			endPoint
+				.replace('{provider}', provider)
+				.replace('{prefix}', prefix)
+				.replace('{icons}', '').length -
 			extraLength;
 	}
 
@@ -126,6 +129,7 @@ function calculateMaxLength(prefix: string): number {
  * Prepare params
  */
 export const prepareQuery: IconifyAPIPrepareQuery = (
+	provider: string,
 	prefix: string,
 	icons: string[]
 ): APIQueryParams[] => {
@@ -134,11 +138,12 @@ export const prepareQuery: IconifyAPIPrepareQuery = (
 	// Get maximum icons list length
 	let maxLength = maxLengthCache[prefix];
 	if (maxLength === void 0) {
-		maxLength = calculateMaxLength(prefix);
+		maxLength = calculateMaxLength(provider, prefix);
 	}
 
 	// Split icons
 	let item: APIQueryParams = {
+		provider,
 		prefix,
 		icons: [],
 	};
@@ -149,6 +154,7 @@ export const prepareQuery: IconifyAPIPrepareQuery = (
 			// Next set
 			results.push(item);
 			item = {
+				provider,
 				prefix,
 				icons: [],
 			};
@@ -170,6 +176,7 @@ export const sendQuery: IconifyAPISendQuery = (
 	params: APIQueryParams,
 	status: RedundancyPendingItem
 ): void => {
+	const provider = params.provider;
 	const prefix = params.prefix;
 	const icons = params.icons;
 	const iconsList = icons.join(',');
@@ -180,7 +187,9 @@ export const sendQuery: IconifyAPISendQuery = (
 	const global = getGlobal();
 
 	// Callback hash
-	let cbCounter = hash(host + ':' + prefix + ':' + iconsList);
+	let cbCounter = hash(
+		provider + ':' + host + ':' + prefix + ':' + iconsList
+	);
 	while (global[cbPrefix + cbCounter] !== void 0) {
 		cbCounter++;
 	}
@@ -189,6 +198,7 @@ export const sendQuery: IconifyAPISendQuery = (
 	let path =
 		pathCache[prefix] +
 		endPoint
+			.replace('{provider}', provider)
 			.replace('{prefix}', prefix)
 			.replace('{icons}', iconsList)
 			.replace('{cb}', callbackName);
diff --git a/packages/iconify/src/scan.ts b/packages/iconify/src/scan.ts
index a44ad01..a78a347 100644
--- a/packages/iconify/src/scan.ts
+++ b/packages/iconify/src/scan.ts
@@ -53,18 +53,20 @@ export function scanDOM(root?: HTMLElement): void {
 	// Observer
 	let paused = false;
 
-	// List of icons to load
-	const loadIcons: Record<string, Record<string, boolean>> = Object.create(
-		null
-	);
+	// List of icons to load: [provider][prefix][name] = boolean
+	const loadIcons: Record<
+		string,
+		Record<string, Record<string, boolean>>
+	> = Object.create(null);
 
 	// Get root node and placeholders
 	if (!root) {
 		root = getRoot();
 	}
-	findPlaceholders(root).forEach(item => {
+	findPlaceholders(root).forEach((item) => {
 		const element = item.element;
 		const iconName = item.name;
+		const provider = iconName.provider;
 		const prefix = iconName.prefix;
 		const name = iconName.name;
 		let data: IconifyElementData = element[elementDataProperty];
@@ -79,7 +81,7 @@ export function scanDOM(root?: HTMLElement): void {
 				case 'loading':
 					if (
 						coreModules.api &&
-						coreModules.api.isPending(prefix, name)
+						coreModules.api.isPending({ provider, prefix, name })
 					) {
 						// Pending
 						return;
@@ -88,7 +90,7 @@ export function scanDOM(root?: HTMLElement): void {
 		}
 
 		// Check icon
-		const storage = getStorage(prefix);
+		const storage = getStorage(provider, prefix);
 		if (storage.icons[name] !== void 0) {
 			// Icon exists - replace placeholder
 			if (browserModules.observer && !paused) {
@@ -124,12 +126,16 @@ export function scanDOM(root?: HTMLElement): void {
 		}
 
 		if (coreModules.api) {
-			if (!coreModules.api.isPending(prefix, name)) {
+			if (!coreModules.api.isPending({ provider, prefix, name })) {
 				// Add icon to loading queue
-				if (loadIcons[prefix] === void 0) {
-					loadIcons[prefix] = Object.create(null);
+				if (loadIcons[provider] === void 0) {
+					loadIcons[provider] = Object.create(null);
 				}
-				loadIcons[prefix][name] = true;
+				const providerLoadIcons = loadIcons[provider];
+				if (providerLoadIcons[prefix] === void 0) {
+					providerLoadIcons[prefix] = Object.create(null);
+				}
+				providerLoadIcons[prefix][name] = true;
 			}
 		}
 
@@ -145,17 +151,21 @@ export function scanDOM(root?: HTMLElement): void {
 	// Load icons
 	if (coreModules.api) {
 		const api = coreModules.api;
-		Object.keys(loadIcons).forEach(prefix => {
-			api.loadIcons(
-				Object.keys(loadIcons[prefix]).map(name => {
-					const icon: IconifyIconName = {
-						prefix,
-						name,
-					};
-					return icon;
-				}),
-				checkPendingIcons
-			);
+		Object.keys(loadIcons).forEach((provider) => {
+			const providerLoadIcons = loadIcons[provider];
+			Object.keys(providerLoadIcons).forEach((prefix) => {
+				api.loadIcons(
+					Object.keys(providerLoadIcons[prefix]).map((name) => {
+						const icon: IconifyIconName = {
+							provider,
+							prefix,
+							name,
+						};
+						return icon;
+					}),
+					checkPendingIcons
+				);
+			});
 		});
 	}