diff --git a/angular.json b/angular.json
index dd13712fb2..3852833087 100644
--- a/angular.json
+++ b/angular.json
@@ -478,6 +478,13 @@
                 "build": {
                     "builder": "@angular-devkit/build-angular:application",
                     "options": {
+                        "assets": [
+                            {
+                                "glob": "**/*",
+                                "input": "packages/components-dev/app-switcher/assets",
+                                "output": "/assets"
+                            }
+                        ],
                         "outputPath": {
                             "base": "dist/components-dev/app-switcher"
                         },
diff --git a/packages/components-dev/app-switcher/assets/icon.svg b/packages/components-dev/app-switcher/assets/icon.svg
new file mode 100644
index 0000000000..aacdbb3776
--- /dev/null
+++ b/packages/components-dev/app-switcher/assets/icon.svg
@@ -0,0 +1 @@
+<svg fill="none" height="512" viewBox="0 0 512 512" width="512" xmlns="http://www.w3.org/2000/svg"><path d="M441.25 295H304.75C299.365 295 295 299.365 295 304.75V441.25C295 446.635 299.365 451 304.75 451H441.25C446.635 451 451 446.635 451 441.25V304.75C451 299.365 446.635 295 441.25 295Z" fill="#FF2222"/><path d="M207.25 61H70.75C65.3875 61 61 65.3875 61 70.75V207.25C61 212.613 65.3875 217 70.75 217H129.25C134.613 217 139 212.613 139 207.25V148.75C139 143.387 143.387 139 148.75 139H207.25C212.613 139 217 134.613 217 129.25V70.75C217 65.3875 212.613 61 207.25 61Z" fill="#FF2222" clip-rule="evenodd" fill-rule="evenodd"/><path d="M207.25 295H70.75C65.3875 295 61 299.387 61 304.75V363.25C61 368.613 65.3875 373 70.75 373H129.25C134.613 373 139 377.387 139 382.75V441.25C139 446.613 143.387 451 148.75 451H207.25C212.613 451 217 446.613 217 441.25V304.75C217 299.387 212.613 295 207.25 295Z" fill="#FF2222" clip-rule="evenodd" fill-rule="evenodd"/><path d="M441.25 61H382.75C377.387 61 373 65.3875 373 70.75V129.25C373 134.612 368.612 139 363.25 139H304.75C299.387 139 295 143.387 295 148.75V207.25C295 212.612 299.387 217 304.75 217H441.25C446.612 217 451 212.612 451 207.25V70.75C451 65.3875 446.612 61 441.25 61Z" fill="#FF2222" clip-rule="evenodd" fill-rule="evenodd"/></svg>
diff --git a/packages/components-dev/app-switcher/module.ts b/packages/components-dev/app-switcher/module.ts
index 69e257467f..7777b86ed6 100644
--- a/packages/components-dev/app-switcher/module.ts
+++ b/packages/components-dev/app-switcher/module.ts
@@ -9,6 +9,7 @@ import { DevThemeToggle } from '../theme-toggle';
     template: `
         <app-switcher-overview-example />
         <br />
+        <br />
         <app-switcher-sites-example />
     `,
     changeDetection: ChangeDetectionStrategy.OnPush
diff --git a/packages/components-dev/app-switcher/template.html b/packages/components-dev/app-switcher/template.html
index ee5b0a6424..2edc20cc30 100644
--- a/packages/components-dev/app-switcher/template.html
+++ b/packages/components-dev/app-switcher/template.html
@@ -1,4 +1,6 @@
 <dev-theme-toggle />
+<br />
+<br />
 
 <dev-examples />
 
diff --git a/packages/components/app-switcher/app-switcher-dropdown-app.ts b/packages/components/app-switcher/app-switcher-dropdown-app.ts
index cfe00bd58c..f2ff78870c 100644
--- a/packages/components/app-switcher/app-switcher-dropdown-app.ts
+++ b/packages/components/app-switcher/app-switcher-dropdown-app.ts
@@ -1,3 +1,4 @@
+import { NgOptimizedImage } from '@angular/common';
 import { ChangeDetectionStrategy, Component, inject, Input, ViewEncapsulation } from '@angular/core';
 import { DomSanitizer } from '@angular/platform-browser';
 import { KBQ_TITLE_TEXT_REF } from '@koobiq/components/core';
@@ -8,10 +9,20 @@ import { KbqAppSwitcherApp } from './app-switcher';
 /** @docs-private */
 @Component({
     selector: '[kbq-app-switcher-dropdown-app]',
-    imports: [KbqIcon],
+    imports: [KbqIcon, NgOptimizedImage],
     template: `
         <i class="kbq kbq-icon" [className]=""></i>
-        <span class="kbq-app-switcher-dropdown-app__icon" [innerHtml]="getIcon(app.icon)"></span>
+        @if (app.icon) {
+            <span class="kbq-app-switcher-dropdown-app__icon" [innerHtml]="getIcon(app.icon)"></span>
+        } @else if (app.iconSrc) {
+            <img
+                alt="{{ app.type }}"
+                width="24"
+                height="24"
+                class="kbq-app-switcher-dropdown-app__icon"
+                [ngSrc]="app.iconSrc"
+            />
+        }
 
         <div class="kbq-app-switcher-dropdown-app__container">
             <div class="kbq-app-switcher-dropdown-app__name">
diff --git a/packages/components/app-switcher/app-switcher.ts b/packages/components/app-switcher/app-switcher.ts
index df0439d33c..d2c9d2e80b 100644
--- a/packages/components/app-switcher/app-switcher.ts
+++ b/packages/components/app-switcher/app-switcher.ts
@@ -60,7 +60,8 @@ export interface KbqAppSwitcherApp {
     name: string;
     id: string | number;
     type?: string | number;
-    icon: string;
+    icon?: string;
+    iconSrc?: string;
     caption?: string;
     aliases?: KbqAppSwitcherApp[];
     link?: string;
@@ -71,6 +72,7 @@ export interface KbqAppSwitcherSite {
     id: string | number;
     status?: string;
     icon?: string;
+    iconSrc?: string;
     apps: KbqAppSwitcherApp[];
 }
 
@@ -92,6 +94,7 @@ export function defaultGroupBy(
                 name: appType,
                 aliases: [app],
                 icon: app.icon,
+                iconSrc: app.iconSrc,
                 id: ''
             };
         }
diff --git a/packages/components/app-switcher/kbq-app-switcher-list-item.ts b/packages/components/app-switcher/kbq-app-switcher-list-item.ts
index 95cc78d619..2e780b77f4 100644
--- a/packages/components/app-switcher/kbq-app-switcher-list-item.ts
+++ b/packages/components/app-switcher/kbq-app-switcher-list-item.ts
@@ -1,18 +1,30 @@
+import { NgOptimizedImage } from '@angular/common';
 import { booleanAttribute, ChangeDetectionStrategy, Component, inject, Input, ViewEncapsulation } from '@angular/core';
 import { DomSanitizer } from '@angular/platform-browser';
 import { KBQ_TITLE_TEXT_REF } from '@koobiq/components/core';
 import { KbqDropdownItem } from '@koobiq/components/dropdown';
-import { KbqIcon } from '@koobiq/components/icon';
+import { KbqIconModule } from '@koobiq/components/icon';
 import { KbqAppSwitcherApp } from './app-switcher';
 
 /** @docs-private */
 @Component({
     selector: '[kbq-app-switcher-list-item]',
     imports: [
-        KbqIcon
+        KbqIconModule,
+        NgOptimizedImage
     ],
     template: `
-        <span class="kbq-app-switcher-list-item__icon" [innerHtml]="getIcon(app.icon)"></span>
+        @if (app.icon) {
+            <span class="kbq-app-switcher-list-item__icon" [innerHtml]="getIcon(app.icon)"></span>
+        } @else if (app.iconSrc) {
+            <img
+                alt="{{ app.type }}"
+                class="kbq-app-switcher-list-item__icon"
+                width="24"
+                height="24"
+                [ngSrc]="app.iconSrc"
+            />
+        }
 
         <div class="kbq-app-switcher-list-item__container">
             <div class="kbq-app-switcher-list-item__name">{{ app.name }}</div>
diff --git a/packages/docs-examples/components/app-switcher/app-switcher-overview/app-switcher-overview-example.ts b/packages/docs-examples/components/app-switcher/app-switcher-overview/app-switcher-overview-example.ts
index 47ead67ec5..636f759ee8 100644
--- a/packages/docs-examples/components/app-switcher/app-switcher-overview/app-switcher-overview-example.ts
+++ b/packages/docs-examples/components/app-switcher/app-switcher-overview/app-switcher-overview-example.ts
@@ -44,18 +44,18 @@ export class AppSwitcherOverviewExample {
                     name: 'Byte Sentinel',
                     caption: 'Byte 001',
                     id: 'SZFO_01',
-                    icon: this.SVGIcon
+                    iconSrc: 'assets/icon.svg'
                 },
                 {
                     name: 'CryptoWall',
                     id: 'SZFO_02',
-                    icon: this.SVGIcon
+                    iconSrc: 'assets/icon.svg'
                 },
                 {
                     name: 'App Instance 1',
                     caption: 'Instance Alias One',
                     id: 'SZFO_03',
-                    icon: this.SVGIcon
+                    iconSrc: 'assets/icon.svg'
                 },
                 {
                     name: 'App Instance 2',
diff --git a/packages/docs-examples/components/app-switcher/app-switcher-sites/app-switcher-sites-example.ts b/packages/docs-examples/components/app-switcher/app-switcher-sites/app-switcher-sites-example.ts
index 27915579be..7492f90126 100644
--- a/packages/docs-examples/components/app-switcher/app-switcher-sites/app-switcher-sites-example.ts
+++ b/packages/docs-examples/components/app-switcher/app-switcher-sites/app-switcher-sites-example.ts
@@ -45,7 +45,7 @@ export class AppSwitcherSitesExample {
                     caption: 'Byte 001',
                     id: 'SZFO_01',
                     type: 'NAD',
-                    icon: this.SVGIcon
+                    iconSrc: 'assets/icon.svg'
                 },
                 {
                     name: 'CryptoWall',
@@ -110,7 +110,7 @@ export class AppSwitcherSitesExample {
                     caption: 'Byte 001',
                     id: 'UFO_01',
                     type: 'SIEM',
-                    icon: this.SVGIcon
+                    iconSrc: 'assets/icon.svg'
                 },
                 {
                     name: 'CryptoWall',