diff --git a/web/gui/src/main/webapp/app/fw/mast/mast.css b/web/gui/src/main/webapp/app/fw/mast/mast.css
index 0722f6dbbd..33c695938a 100644
--- a/web/gui/src/main/webapp/app/fw/mast/mast.css
+++ b/web/gui/src/main/webapp/app/fw/mast/mast.css
@@ -32,7 +32,7 @@
 }
 .dark #mast {
     background-color: #444;
-    box-shadow: 0 2px 8px #777;
+    box-shadow: 0 2px 8px #222;
 }
 
 #mast img.logo {
diff --git a/web/gui/src/main/webapp/app/onos.css b/web/gui/src/main/webapp/app/onos.css
index 1ab5954d99..0449853a19 100644
--- a/web/gui/src/main/webapp/app/onos.css
+++ b/web/gui/src/main/webapp/app/onos.css
@@ -37,6 +37,13 @@ body {
     overflow: hidden;
 }
 
+body.light {
+    background-color: white;
+}
+body.dark {
+    background-color: #2b2b2b;
+}
+
 #view {
     padding: 6px;
     width: 100%;
diff --git a/web/gui/src/main/webapp/app/view/topo/topo.css b/web/gui/src/main/webapp/app/view/topo/topo.css
index 01300ff0a3..51ef5ad33c 100644
--- a/web/gui/src/main/webapp/app/view/topo/topo.css
+++ b/web/gui/src/main/webapp/app/view/topo/topo.css
@@ -20,15 +20,24 @@
  @author Simon Hunt
  */
 
-#ov-topo svg {
+.light #ov-topo svg {
     background-color: #fff;
     /* For Debugging the placement of the SVG layer... */
     /*border: 1px solid red;*/
 }
+.dark #ov-topo svg {
+    background-color: #2b2b2b;
+}
 
 #ov-topo svg #topo-map {
     stroke-width: 2px;
-    /*stroke: #eee;*/
-    stroke: #88b;
     fill: transparent;
-}
\ No newline at end of file
+}
+
+.light #ov-topo svg #topo-map {
+    stroke: #eee;
+    /*stroke: #88b;*/
+}
+.dark #ov-topo svg #topo-map {
+    stroke: #444;
+}