diff --git a/app/assets/javascripts/osm.js.erb b/app/assets/javascripts/osm.js.erb
index e9c09c79f9..d14b26a823 100644
--- a/app/assets/javascripts/osm.js.erb
+++ b/app/assets/javascripts/osm.js.erb
@@ -231,5 +231,13 @@ OSM = {
         Math.pow(Math.sin(latdiff / 2), 2) +
         Math.cos(lat1) * Math.cos(lat2) * Math.pow(Math.sin(lngdiff / 2), 2)
       ));
+  },
+
+  isDarkMap: function() {
+    var siteTheme = $('html').attr('data-bs-theme');
+    var mapTheme = $('html').attr('data-map-theme');
+    if (mapTheme) return mapTheme === 'dark';
+    if (siteTheme) return siteTheme === 'dark';
+    return window.matchMedia('(prefers-color-scheme: dark)').matches
   }
 };
diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss
index 323f60e08c..5b8cf44a12 100644
--- a/app/assets/stylesheets/common.scss
+++ b/app/assets/stylesheets/common.scss
@@ -9,7 +9,7 @@
 
 body {
   font-size: $typeheight;
-  --dark-mode-map-filter: brightness(.8);
+  --dark-mode-map-filter: none;
 }
 
 time[title] {
diff --git a/vendor/assets/leaflet/leaflet.osm.js b/vendor/assets/leaflet/leaflet.osm.js
index 0e51f34086..ce1609a9c8 100644
--- a/vendor/assets/leaflet/leaflet.osm.js
+++ b/vendor/assets/leaflet/leaflet.osm.js
@@ -7,8 +7,20 @@ L.OSM.TileLayer = L.TileLayer.extend({
   },
 
   initialize: function (options) {
+    isDarkMap = OSM.isDarkMap();
+    options.filter = (isDarkMap ? options.darkFilter : options.lightFilter) || options.filter || 'none';
     options = L.Util.setOptions(this, options);
-    L.TileLayer.prototype.initialize.call(this, options.url);
+    url = isDarkMap ? options.darkUrl : options.lightUrl;
+    if (url) this.schemeClass = isDarkMap ? 'dark' : 'light';
+    L.TileLayer.prototype.initialize.call(this, url || options.url);
+    this.on('add', function () {
+      container = this.getContainer();
+      if (container) {
+        if (this.schemeClass) container.classList.add(this.schemeClass);
+        container.style.setProperty('--dark-mode-map-filter', this.options.filter);
+        if (document.getElementById('map').contains(container)) document.querySelector('.key-ui').style.setProperty('--dark-mode-map-filter', this.options.filter);
+      }
+    });
   }
 });
 
@@ -39,6 +51,7 @@ L.OSM.CycleMap = L.OSM.TileLayer.extend({
 L.OSM.TransportMap = L.OSM.TileLayer.extend({
   options: {
     url: 'https://{s}.tile.thunderforest.com/transport/{z}/{x}/{y}{r}.png?apikey={apikey}',
+    darkUrl: 'https://{s}.tile.thunderforest.com/transport-dark/{z}/{x}/{y}{r}.png?apikey={apikey}',
     maxZoom: 21,
     attribution: '© <a href="https://www.openstreetmap.org/copyright" target="_blank">OpenStreetMap</a> contributors. Tiles courtesy of <a href="http://www.thunderforest.com/" target="_blank">Andy Allan</a>'
   }