diff --git a/scripts/generateLayouts.ts b/scripts/generateLayouts.ts
index d1056c485..16c9bc8bb 100644
--- a/scripts/generateLayouts.ts
+++ b/scripts/generateLayouts.ts
@@ -277,8 +277,14 @@ class GenerateLayouts extends Script {
 
             if (f.properties.type === "vector") {
                 // We also need to whitelist eventual sources
-                const styleSpec = await Utils.downloadJsonCached(f.properties.url, 1000 * 120)
-                for (const key of Object.keys(styleSpec.sources)) {
+                let url = f.properties.url
+                if(url.startsWith("pmtiles://")){
+                    url = url.substring("pmtiles://".length)
+                }
+                const styleSpec = await Utils.downloadJsonCached(url, 1000 * 120, {
+                    Origin: "https://mapcomplete.org"
+                })
+                for (const key of Object.keys(styleSpec?.sources ?? {})) {
                     const url = styleSpec.sources[key].url
                     if (!url) {
                         continue
@@ -290,7 +296,9 @@ class GenerateLayouts extends Script {
                     console.log("Source url ", key, url)
                     urls.push(url)
                     if (urlClipped.endsWith(".json")) {
-                        const tileInfo = await Utils.downloadJsonCached(url, 1000 * 120)
+                        const tileInfo = await Utils.downloadJsonCached(url, 1000 * 120, {
+                            Origin: "https://mapcomplete.org"
+                        })
                         urls.push(tileInfo["tiles"] ?? [])
                     }
                 }
@@ -354,9 +362,17 @@ class GenerateLayouts extends Script {
         const eliLayers: RasterLayerPolygon[] = AvailableRasterLayers.layersAvailableAt(
             new ImmutableStore({ lon: 0, lat: 0 })
         ).data
-        const vectorLayers = eliLayers.filter((l) => l.properties.type === "vector")
-        const vectorSources = vectorLayers.map((l) => l.properties.url)
-        apiUrls.push(...vectorSources)
+        {
+            const vectorLayers = eliLayers.filter((l) => l.properties.type === "vector")
+            const vectorSources = vectorLayers.map((l) => l.properties.url)
+            vectorSources.push(...vectorLayers.map((l) => l.properties.style))
+            apiUrls.push(...vectorSources.map(url => {
+                if(url?.startsWith("pmtiles://")){
+                    return url.substring("pmtiles://".length)
+                }
+                return url
+            }))
+        }
         for (let connectSource of apiUrls.concat(geojsonSources)) {
             if (!connectSource) {
                 continue
diff --git a/src/Models/RasterLayers.ts b/src/Models/RasterLayers.ts
index 8ce528bde..12f725fb3 100644
--- a/src/Models/RasterLayers.ts
+++ b/src/Models/RasterLayers.ts
@@ -55,6 +55,9 @@ export class AvailableRasterLayers {
             url:
                 "https://api.maptiler.com/maps/15cc8f61-0353-4be6-b8da-13daea5f7432/style.json?key=" +
                 Constants.maptilerApiKey,
+            style:
+                "https://api.maptiler.com/maps/15cc8f61-0353-4be6-b8da-13daea5f7432/style.json?key=" +
+                Constants.maptilerApiKey,
             category: "osmbasedmap",
             id: "maptiler",
             type: "vector",
diff --git a/src/UI/Map/RasterLayerHandler.ts b/src/UI/Map/RasterLayerHandler.ts
index 3a01d0a8e..cefbbcf73 100644
--- a/src/UI/Map/RasterLayerHandler.ts
+++ b/src/UI/Map/RasterLayerHandler.ts
@@ -1,6 +1,6 @@
 import { Map as MLMap, RasterSourceSpecification, VectorTileSource } from "maplibre-gl"
 import { Store, Stores, UIEventSource } from "../../Logic/UIEventSource"
-import { RasterLayerPolygon } from "../../Models/RasterLayers"
+import { AvailableRasterLayers, RasterLayerPolygon } from "../../Models/RasterLayers"
 import { RasterLayerProperties } from "../../Models/RasterLayerProperties"
 import { Utils } from "../../Utils"
 import { VectorSourceSpecification } from "@maplibre/maplibre-gl-style-spec"
@@ -127,7 +127,11 @@ class SingleBackgroundHandler {
                 .layers.find((l) => l.id.startsWith("mapcomplete_"))?.id
 
             if (background.type === "vector") {
-                map.setStyle(background["style"])
+                if(background.style){
+                    map.setStyle(background.style)
+                }else{
+                    map.setStyle(AvailableRasterLayers.maptilerDefaultLayer.properties.style)
+                }
             } else {
 
                 map.addLayer(
@@ -142,7 +146,11 @@ class SingleBackgroundHandler {
                     addLayerBeforeId
                 )
                 this.opacity.addCallbackAndRun((o) => {
-                    map.setPaintProperty(background.id, "raster-opacity", o)
+                    try{
+                        map.setPaintProperty(background.id, "raster-opacity", o)
+                    }catch (e) {
+                        console.debug("Could not set raster-opacity of", background.id)
+                    }
                 })
             }
         }
diff --git a/src/assets/global-raster-layers.json b/src/assets/global-raster-layers.json
index 50b74aae7..76bd39f13 100644
--- a/src/assets/global-raster-layers.json
+++ b/src/assets/global-raster-layers.json
@@ -177,7 +177,7 @@
       }
     },
     {
-      "url": "pmtiles://https://api.protomaps.com/tiles/v3/{z}/{x}/{y}.mvt?key=2af8b969a9e8b692",
+      "url": "pmtiles://https://api.protomaps.com/tiles/v3.json?key=2af8b969a9e8b692",
       "style": "https://api.protomaps.com/styles/v2/white.json?key=2af8b969a9e8b692",
       "id": "protomaps.white",
       "name": "Protomaps White",
@@ -189,7 +189,7 @@
       }
     },
     {
-      "url": "pmtiles://https://api.protomaps.com/tiles/v3/{z}/{x}/{y}.mvt?key=2af8b969a9e8b692",
+      "url": "pmtiles://https://api.protomaps.com/tiles/v3.json?key=2af8b969a9e8b692",
       "style": "https://api.protomaps.com/styles/v2/light.json?key=2af8b969a9e8b692",
       "id": "protomaps.light",
       "name": "Protomaps Light",
@@ -201,7 +201,7 @@
       }
     },
     {
-      "url": "pmtiles://https://api.protomaps.com/tiles/v3/{z}/{x}/{y}.mvt?key=2af8b969a9e8b692",
+      "url": "pmtiles://https://api.protomaps.com/tiles/v3.json?key=2af8b969a9e8b692",
       "style": "https://api.protomaps.com/styles/v2/grayscale.json?key=2af8b969a9e8b692",
       "id": "protomaps.grayscale",
       "name": "Protomaps Grayscale",
@@ -225,7 +225,7 @@
       }
     },
     {
-      "url": "pmtiles://https://api.protomaps.com/tiles/v3/{z}/{x}/{y}.mvt?key=2af8b969a9e8b692",
+      "url": "pmtiles://https://api.protomaps.com/tiles/v3.json?key=2af8b969a9e8b692",
       "style": "https://api.protomaps.com/styles/v2/black.json?key=2af8b969a9e8b692",
       "id": "protomaps.black",
       "name": "Protomaps Black",