diff --git a/resources/views/navbar.blade.php b/resources/views/navbar.blade.php
index ad8266377..8a1d1437c 100644
--- a/resources/views/navbar.blade.php
+++ b/resources/views/navbar.blade.php
@@ -127,7 +127,11 @@ class="overflow-y-auto fixed inset-0 z-30 opacity-75 bg-theme-secondary-900 {{ $
         @isset($mobile)
             {{ $mobile }}
         @else
-            @include('ark::navbar.items.mobile', ['mobilePositionClass' => $mobilePositionClass ?? null])
+            @include('ark::navbar.items.mobile', [
+                'mobilePositionClass' => $mobilePositionClass ?? null,
+                'mobileDropdownItemColor' => 'text-theme-secondary-900 hover:text-theme-secondary-900 dark:text-theme-secondary-200 dark:hover:text-theme-secondary-200',
+                'mobileDropdownActiveItemColor' => 'dark:bg-theme-secondary-800 dark:text-theme-secondary-200 text-theme-secondary-900 bg-theme-primary-100',
+            ])
         @endisset
     </nav>
 </header>
diff --git a/resources/views/navbar/items/mobile.blade.php b/resources/views/navbar/items/mobile.blade.php
index 9fc89d44e..cba79bb40 100644
--- a/resources/views/navbar/items/mobile.blade.php
+++ b/resources/views/navbar/items/mobile.blade.php
@@ -106,6 +106,9 @@ class="mb-4 ml-8 border-l border-theme-secondary-200"
                     :name="$navItem['label']"
                     :params="$navItem['params'] ?? []"
                     :icon="isset($navItem['icon']) ? $navItem['icon'] : false"
+                    icon-alignment="left"
+                    icon-colors="text-theme-secondary-900 dark:text-theme-secondary-200 group-hover:text-theme-secondary-900"
+                    active-icon-colors="text-theme-secondary-900 dark:text-theme-secondary-200"
                     :attrs="$navItem['attributes'] ?? []"
                     :rounded="false"
                     :item-class="$mobileDropdownItemColor"
diff --git a/resources/views/sidebar-link.blade.php b/resources/views/sidebar-link.blade.php
index 3c679d9f9..5439e3c5b 100644
--- a/resources/views/sidebar-link.blade.php
+++ b/resources/views/sidebar-link.blade.php
@@ -11,6 +11,8 @@
     'attrs' => [],
     'itemClass'       => 'text-theme-secondary-900 hover:text-theme-primary-600 dark:text-theme-secondary-200 dark:hover:text-theme-primary-600',
     'activeItemClass' => 'dark:bg-theme-secondary-800 dark:text-theme-secondary-200 text-theme-primary-600 bg-theme-primary-100',
+    'iconColors' => 'text-theme-primary-300 dark:text-theme-secondary-600 group-hover:text-theme-primary-600',
+    'activeIconColors' => 'text-theme-primary-600 dark:text-theme-secondary-200',
 ])
 
 @php
@@ -50,8 +52,8 @@
             <x-ark-icon
                 :class="Arr::toCssClasses([
                     'mr-1 flex-shrink-0 transition-default',
-                    'text-theme-primary-600 dark:text-theme-secondary-200' => $isCurrent || $active,
-                    'text-theme-primary-300 dark:text-theme-secondary-600 group-hover:text-theme-primary-600' => ! $isCurrent || $active,
+                    $activeIconColors => $isCurrent || $active,
+                    $iconColors => ! $isCurrent || $active,
                 ])"
                 :name="$icon"
             />
@@ -63,8 +65,8 @@
             <x-ark-icon
                 :class="Arr::toCssClasses([
                     'flex-shrink-0 transition-default',
-                    'text-theme-primary-600 dark:text-theme-secondary-200' => $isCurrent || $active,
-                    'text-theme-primary-300 dark:text-theme-secondary-600 group-hover:text-theme-primary-600' => ! $isCurrent || $active,
+                    $activeIconColors => $isCurrent || $active,
+                    $iconColors => ! $isCurrent || $active,
                 ])"
                 :name="$icon"
             />