diff --git a/src/kiri/init.js b/src/kiri/init.js
index d602fe3e..124414e7 100644
--- a/src/kiri/init.js
+++ b/src/kiri/init.js
@@ -88,7 +88,6 @@
     function booleanSave() {
         let control = settings().controller;
         let isDark = control.dark;
-        let isReload = false;
         control.expert = UI.expert.checked;
         control.showOrigin = UI.showOrigin.checked;
         control.autoLayout = UI.autoLayout.checked;
@@ -104,14 +103,8 @@
         platform.layout();
         platform.update_stock();
         API.conf.save();
-        // if dark mode changed, reload UI
-        if (isDark !== control.dark) {
-            isReload = true;
-        }
         API.mode.set_expert(control.expert);
-        if (isReload) {
-            API.space.reload();
-        }
+        API.platform.update_size();
     }
 
     function onLayerToggle() {
diff --git a/src/kiri/main.js b/src/kiri/main.js
index 6cdb9d8f..61918202 100644
--- a/src/kiri/main.js
+++ b/src/kiri/main.js
@@ -1017,10 +1017,12 @@
         if (ctrl.dark) {
             SPACE.platform.setGrid(gridMajor, gridMinor, 0x999999, 0x333333);
             SPACE.platform.opacity(0.8);
+            SPACE.setSkyColor(0);
             DOC.body.classList.add('dark');
         } else {
             SPACE.platform.setGrid(gridMajor, gridMinor, 0x999999, 0xcccccc);
             SPACE.platform.opacity(0.3);
+            SPACE.setSkyColor(0xffffff);
             DOC.body.classList.remove('dark');
         }
         SPACE.platform.setGZOff(height/2 - 0.1);
diff --git a/src/moto/space.js b/src/moto/space.js
index eda30d4c..b4168623 100644
--- a/src/moto/space.js
+++ b/src/moto/space.js
@@ -29,6 +29,8 @@
         alignedTracking = false,
         skyColor = 0xbbbbbb,
         skyGridColor = 0xcccccc,
+        skyMaterial = undefined,
+        skyGridMaterial = undefined,
         showSkyGrid = true,
         showPlatform = true,
         hidePlatformBelow = true,
@@ -581,9 +583,19 @@
         update: requestRefresh,
         refresh: refresh,
 
-        showSkyGrid: function(b) { showSkyGrid = b },
-        setSkyColor: function(c) { skyColor = c },
-        setSkyGridColor: function(c) { skyGridColor = c },
+        showSkyGrid: function(b) {
+            showSkyGrid = b;
+        },
+
+        setSkyColor: function(c) {
+            skyColor = c;
+            if (skyMaterial) skyMaterial.color = new THREE.Color(c);
+        },
+
+        setSkyGridColor: function(c) {
+            skyGridColor = c;
+            if (skyGridMaterial) skyGridMaterial.color = new THREE.Color(c);
+        },
 
         scene: {
             add: function (o) {
@@ -752,10 +764,12 @@
 
             let sky = new THREE.Mesh(
                     new THREE.BoxGeometry(50000, 50000, 50000, 1, 1, 1),
+                    skyMaterial =
                     new THREE.MeshBasicMaterial({ color: skyColor, side: THREE.DoubleSide })
                 ),
                 skygrid = new THREE.Mesh(
                     new THREE.BoxGeometry(5000, 5000, 5000, 10, 10, 10),
+                    skyGridMaterial =
                     new THREE.MeshBasicMaterial({ color: skyGridColor, side: THREE.DoubleSide })
                 );