diff --git a/projects/demo/src/modules/app/app.providers.ts b/projects/demo/src/modules/app/app.providers.ts
index 020bbb58c45ca..7c3ca81cd1b12 100644
--- a/projects/demo/src/modules/app/app.providers.ts
+++ b/projects/demo/src/modules/app/app.providers.ts
@@ -9,7 +9,7 @@ import {inject, PLATFORM_ID, Provider} from '@angular/core';
 import {Title} from '@angular/platform-browser';
 import {UrlTree} from '@angular/router';
 import {environment} from '@demo/environments/environment';
-import {SESSION_STORAGE} from '@ng-web-apis/common';
+import {SESSION_STORAGE, WINDOW} from '@ng-web-apis/common';
 import {
     TUI_DOC_CODE_EDITOR,
     TUI_DOC_DEFAULT_TABS,
@@ -40,6 +40,7 @@ import {
     TUI_HINT_OPTIONS,
     TUI_SANITIZER,
 } from '@taiga-ui/core';
+import {TUI_ICON_RESOLVER} from '@taiga-ui/experimental';
 import {TuiLanguageName, tuiLanguageSwitcher} from '@taiga-ui/i18n';
 import {NgDompurifySanitizer} from '@tinkoff/ng-dompurify';
 import {HIGHLIGHT_OPTIONS} from 'ngx-highlightjs';
@@ -206,6 +207,18 @@ export const APP_PROVIDERS: Provider[] = [
     },
     tuiDocExampleOptionsProvider({fullsize: false}),
     metrikaOptionsProvider({id: environment.ym}),
+    {
+        provide: TUI_ICON_RESOLVER,
+        deps: [WINDOW],
+        useFactory: (window: Window) => (icon: string) =>
+            !icon || icon.includes('/')
+                ? icon
+                : `/assets/taiga-ui/icons/${
+                      window.origin.includes('taiga-ui') || icon.includes('Outline')
+                          ? icon
+                          : icon.replace('Large', '').concat('Outline')
+                  }.svg`,
+    },
     tuiLanguageSwitcher(
         async (language: TuiLanguageName): Promise<unknown> =>
             import(