diff --git a/www/assets/js/map_leaflet.js b/www/assets/js/map_leaflet.js
index d33c36f..d0fc4e5 100644
--- a/www/assets/js/map_leaflet.js
+++ b/www/assets/js/map_leaflet.js
@@ -17,12 +17,21 @@ function leafletMap() {
     map.maptype = "leaflet";
 
     if (getStorage("mapsource") == null) {
-        setStorage("mapsource", "liberty");
+        setStorage("mapsource", "auto");
     }
+    mapsource = getStorage("mapsource");
 
-    $("#mapbox").css("background-color", SETTINGS.maptileurls[getStorage("mapsource")].bgcolor);
+    if (mapsource == "auto") {
+        if ($("#app").hasClass("theme-dark")) {
+            mapsource = "libertydark";
+        } else {
+            mapsource = "liberty";
+        }
+    }
+
+    $("#mapbox").css("background-color", SETTINGS.maptileurls[mapsource].bgcolor);
 
-    L.tileLayer(SETTINGS.maptileurls[getStorage("mapsource")].url, {
+    L.tileLayer(SETTINGS.maptileurls[mapsource].url, {
         minZoom: 1,
         maxZoom: 19
     }).addTo(map);
diff --git a/www/assets/js/map_mapbox.js b/www/assets/js/map_mapbox.js
index d3ac320..b8b9162 100644
--- a/www/assets/js/map_mapbox.js
+++ b/www/assets/js/map_mapbox.js
@@ -10,17 +10,27 @@ var firstload = true;
 
 function mapboxMap() {
 
+    var mapsource = "auto";
+
     if (getStorage("mapsource") == null) {
-        setStorage("mapsource", "liberty");
+        setStorage("mapsource", "auto");
+    }
+    mapsource = getStorage("mapsource");
+
+    if (mapsource == "auto") {
+        if ($("#app").hasClass("theme-dark")) {
+            mapsource = "libertydark";
+        } else {
+            mapsource = "liberty";
+        }
     }
 
-    $("#mapbox").css("background-color", SETTINGS.maptileurls[getStorage("mapsource")].bgcolor);
+    $("#mapbox").css("background-color", SETTINGS.maptileurls[mapsource].bgcolor);
 
     mapboxgl.accessToken = SETTINGS.mapboxpublictoken;
     var map = new mapboxgl.Map({
         container: 'mapbox',
-        style: SETTINGS.maptileurls[getStorage("mapsource")].json,
-        //attributionControl: false,
+        style: SETTINGS.maptileurls[mapsource].json,
         dragPan: true,
         pitch: 0,
         zoom: 2,
diff --git a/www/routes.js b/www/routes.js
index fec2047..77598e4 100644
--- a/www/routes.js
+++ b/www/routes.js
@@ -691,7 +691,13 @@ var routes = [
                 path: '/maps',
                 name: 'settings',
                 async: function (routeTo, routeFrom, resolve, reject) {
-                    var mapstyles = [];
+                    var mapstyles = [
+                        {
+                            value: "auto",
+                            label: "Auto",
+                            selected: !inStorage("mapsource") || getStorage("mapsource") == "auto"
+                        }
+                    ];
                     for (var id in SETTINGS.maptileurls) {
                         if (SETTINGS.maptileurls.hasOwnProperty(id)) {
                             mapstyles.push({
@@ -859,21 +865,21 @@ var routes = [
                         });
                     }
                     settings.push({
-                            setting: "showhelp",
-                            title: "Show help",
-                            text: "Show the <span class=material-icons-intext><i class=material-icons>help</i></span> icons",
-                            toggle: true,
-                            checked: getStorage("show_help") != "false",
-                            onclick: ""
-                        },
-                        {
-                            setting: "oldhomeui",
-                            title: "Show home screen as list",
-                            text: "Use a vertical list instead of tiles.",
-                            toggle: true,
-                            checked: getStorage("oldhomeui") == "true",
-                            onclick: ""
-                        }
+                        setting: "showhelp",
+                        title: "Show help",
+                        text: "Show the <span class=material-icons-intext><i class=material-icons>help</i></span> icons",
+                        toggle: true,
+                        checked: getStorage("show_help") != "false",
+                        onclick: ""
+                    },
+                            {
+                                setting: "oldhomeui",
+                                title: "Show home screen as list",
+                                text: "Use a vertical list instead of tiles.",
+                                toggle: true,
+                                checked: getStorage("oldhomeui") == "true",
+                                onclick: ""
+                            }
                     );
                     resolve({
                         templateUrl: './pages/settings.html'