diff --git a/src/app/components/player-toolbar/player-toolbar.component.html b/src/app/components/player-toolbar/player-toolbar.component.html
index 6187e86..e9b007c 100644
--- a/src/app/components/player-toolbar/player-toolbar.component.html
+++ b/src/app/components/player-toolbar/player-toolbar.component.html
@@ -1,8 +1,8 @@
-<ion-content color="dark">
-  <ion-toolbar class="play-toolbar" color="dark">
+<ion-content color="primary">
+  <ion-toolbar class="play-toolbar" color="primary">
     <ng-container *ngIf="(displayState$|async) as state ">
       <ng-container *ngFor="let stream of state.server.streams">
-        <ion-item *ngIf="stream.properties.metadata" class="ion-padding-top" lines="none" color="dark">
+        <ion-item *ngIf="stream.properties.metadata" class="ion-padding-top" lines="none" color="primary">
           <ion-thumbnail slot="start">
             <img [src]="stream.properties.metadata.artData
       ? convertCoverDataBase64(stream.properties.metadata.artData.data, stream.properties.metadata.artData.extension)
@@ -29,7 +29,7 @@ <h2> {{ stream.properties.metadata.title }}</h2>
       </ion-item> -->
         <ng-container *ngFor="let group of state.server.groups">
           <ng-container *ngIf="group.clients[0].connected">
-            <ion-item *ngIf="group.stream_id === stream.id" lines="none" color="dark">
+            <ion-item *ngIf="group.stream_id === stream.id" lines="none" color="primary">
               <ion-label>
                 <p>
                   <app-client-name [group]="group"></app-client-name>
diff --git a/src/app/pages/dashboard/dashboard.page.html b/src/app/pages/dashboard/dashboard.page.html
index 6fbdb6c..ff745ab 100644
--- a/src/app/pages/dashboard/dashboard.page.html
+++ b/src/app/pages/dashboard/dashboard.page.html
@@ -1,5 +1,5 @@
 <ion-header class="ion-no-border">
-  <ion-toolbar>
+  <ion-toolbar color="light">
     <ion-title>Dashboard</ion-title>
     <!-- <ion-title *ngIf="(userProfile) as user">{{user.displayName}}s Home </ion-title> -->
   </ion-toolbar>
diff --git a/src/app/pages/devices/devices.page.html b/src/app/pages/devices/devices.page.html
index e4ec53b..34af9df 100644
--- a/src/app/pages/devices/devices.page.html
+++ b/src/app/pages/devices/devices.page.html
@@ -1,5 +1,5 @@
 <ion-header [translucent]="true">
-  <ion-toolbar>
+  <ion-toolbar color="light">
     <ion-title>Devices</ion-title>
   </ion-toolbar>
 </ion-header>
diff --git a/src/app/tabs/tabs.page.html b/src/app/tabs/tabs.page.html
index d01ed70..3004731 100644
--- a/src/app/tabs/tabs.page.html
+++ b/src/app/tabs/tabs.page.html
@@ -1,7 +1,7 @@
 <ion-tabs >
   <div class="page-padding-bottom">
     </div>
-  <ion-tab-bar class="tabbar" slot="bottom" color="dark">
+  <ion-tab-bar class="tabbar" slot="bottom" color="primary">
     <ion-tab-button tab="dashboard" href="/tabs/dashboard">
       <ion-icon aria-hidden="true" name="home-outline"></ion-icon>
       <ion-label>Dashboard</ion-label>
diff --git a/src/theme/variables.scss b/src/theme/variables.scss
index 6f985b8..0087af0 100644
--- a/src/theme/variables.scss
+++ b/src/theme/variables.scss
@@ -176,8 +176,8 @@
     --ion-color-medium-shade: #86888f;
     --ion-color-medium-tint: #a2a4ab;
 
-    --ion-color-light: #222428;
-    --ion-color-light-rgb: 34,36,40;
+    --ion-color-light: #1d1d1e;
+    --ion-color-light-rgb: 29,29,30;
     --ion-color-light-contrast: #ffffff;
     --ion-color-light-contrast-rgb: 255,255,255;
     --ion-color-light-shade: #1e2023;
@@ -190,13 +190,13 @@
    */
 
   .ios body {
-    --ion-background-color: #000000;
-    --ion-background-color-rgb: 0,0,0;
+    --ion-background-color: #1d1d1e;
+    --ion-background-color-rgb: 29,29,30;
 
     --ion-text-color: #ffffff;
     --ion-text-color-rgb: 255,255,255;
 
-    --ion-color-step-50: #0d0d0d;
+    --ion-color-step-50: #1d1d1e;
     --ion-color-step-100: #1a1a1a;
     --ion-color-step-150: #262626;
     --ion-color-step-200: #333333;
@@ -216,9 +216,9 @@
     --ion-color-step-900: #e6e6e6;
     --ion-color-step-950: #f2f2f2;
 
-    --ion-item-background: #000000;
+    --ion-item-background: #1d1d1e;
 
-    --ion-card-background: #1c1c1d;
+    --ion-card-background: #0c0c0b;
   }
 
   .ios ion-modal {