diff --git a/package-lock.json b/package-lock.json
index 38e0774f8..25b424d7d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -13,7 +13,7 @@
         "@vuelidate/validators": "^2.0.0",
         "@vueuse/core": "^10.3.0",
         "@webitel/flow-ui-sdk": "^0.1.14",
-        "@webitel/ui-sdk": "^23.12.101",
+        "@webitel/ui-sdk": "^23.12.104",
         "axios": "^0.27.1",
         "clipboard-copy": "^4.0.1",
         "cron-validator": "^1.3.1",
@@ -1372,9 +1372,9 @@
       }
     },
     "node_modules/@webitel/ui-sdk": {
-      "version": "23.12.101",
-      "resolved": "https://registry.npmjs.org/@webitel/ui-sdk/-/ui-sdk-23.12.101.tgz",
-      "integrity": "sha512-h1TVzt0++OpCeyPSFaSmuUPDd1RjVTb6XRvr9r0gBw4PTSS+zyRyIEm6GtzUKJLpfPSFsSJbcSgojuSqB07d1A==",
+      "version": "23.12.104",
+      "resolved": "https://registry.npmjs.org/@webitel/ui-sdk/-/ui-sdk-23.12.104.tgz",
+      "integrity": "sha512-3ILQieIngDtApvl5k514BqCqD/eWBFRaLRdkAseYVwB9+YeQCicAbSxFfcXXH2w7GfS6UUUw9CGTWK0ztBxP0Q==",
       "dependencies": {
         "@floating-ui/vue": "^1.0.1",
         "@vuelidate/core": "^2.0.3",
@@ -9252,9 +9252,9 @@
       }
     },
     "@webitel/ui-sdk": {
-      "version": "23.12.101",
-      "resolved": "https://registry.npmjs.org/@webitel/ui-sdk/-/ui-sdk-23.12.101.tgz",
-      "integrity": "sha512-h1TVzt0++OpCeyPSFaSmuUPDd1RjVTb6XRvr9r0gBw4PTSS+zyRyIEm6GtzUKJLpfPSFsSJbcSgojuSqB07d1A==",
+      "version": "23.12.104",
+      "resolved": "https://registry.npmjs.org/@webitel/ui-sdk/-/ui-sdk-23.12.104.tgz",
+      "integrity": "sha512-3ILQieIngDtApvl5k514BqCqD/eWBFRaLRdkAseYVwB9+YeQCicAbSxFfcXXH2w7GfS6UUUw9CGTWK0ztBxP0Q==",
       "requires": {
         "@floating-ui/vue": "^1.0.1",
         "@vuelidate/core": "^2.0.3",
diff --git a/package.json b/package.json
index b312e7970..27611f425 100644
--- a/package.json
+++ b/package.json
@@ -16,7 +16,7 @@
     "@vuelidate/validators": "^2.0.0",
     "@vueuse/core": "^10.3.0",
     "@webitel/flow-ui-sdk": "^0.1.14",
-    "@webitel/ui-sdk": "^23.12.101",
+    "@webitel/ui-sdk": "^23.12.104",
     "axios": "^0.27.1",
     "clipboard-copy": "^4.0.1",
     "cron-validator": "^1.3.1",
diff --git a/src/modules/_reusable/app-header/components/app-header.vue b/src/modules/_reusable/app-header/components/app-header.vue
index 5d3d54e4e..f60683e76 100644
--- a/src/modules/_reusable/app-header/components/app-header.vue
+++ b/src/modules/_reusable/app-header/components/app-header.vue
@@ -2,12 +2,14 @@
   <wt-app-header>
     <wt-navigation-bar
       :current-app="currentApp"
+      :dark-mode="darkMode"
       :nav="nav"
     />
     <wt-dark-mode-switcher />
     <wt-app-navigator
       :apps="apps"
       :current-app="currentApp"
+      :dark-mode="darkMode"
     />
     <wt-header-actions
       :build-info="buildInfo"
@@ -47,6 +49,9 @@ export default {
     ...mapGetters('userinfo', {
       checkAccess: 'CHECK_APP_ACCESS',
     }),
+    ...mapGetters('appearance', {
+      darkMode: 'DARK_MODE',
+    }),
     apps() {
       const agent = {
         name: WebitelApplications.AGENT,