diff --git a/app/package-lock.json b/app/package-lock.json
index d15f3c81..3551226d 100644
--- a/app/package-lock.json
+++ b/app/package-lock.json
@@ -8,9 +8,10 @@
       "name": "protomaps-basemaps-app",
       "version": "0.0.0",
       "dependencies": {
-        "maplibre-gl": "5.0.0-pre.1",
+        "@maplibre/maplibre-gl-inspect": "^1.7.0",
+        "maplibre-gl": "4.7.1",
         "pixelmatch": "^5.3.0",
-        "pmtiles": "3.1.0",
+        "pmtiles": "3.2.0",
         "react": "^18.2.0",
         "react-dom": "^18.2.0",
         "react-dropzone": "^14.2.3",
@@ -1002,6 +1003,19 @@
         "node": ">=6.0.0"
       }
     },
+    "node_modules/@maplibre/maplibre-gl-inspect": {
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/@maplibre/maplibre-gl-inspect/-/maplibre-gl-inspect-1.7.0.tgz",
+      "integrity": "sha512-O2C78Dh9zRvVLrm0axgzB9do5spoOGqMnN34xmJVedQWco6tCq49oSyeMuGyBEX9fE9/zLwynnZrAfT5FRN1pQ==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "lodash.isequal": "^4.5.0",
+        "randomcolor": "^0.6.2"
+      },
+      "peerDependencies": {
+        "maplibre-gl": ">3.0.0"
+      }
+    },
     "node_modules/@maplibre/maplibre-gl-style-spec": {
       "version": "20.3.1",
       "resolved": "https://registry.npmjs.org/@maplibre/maplibre-gl-style-spec/-/maplibre-gl-style-spec-20.3.1.tgz",
@@ -1816,6 +1830,12 @@
         "url": "https://github.com/sponsors/antfu"
       }
     },
+    "node_modules/lodash.isequal": {
+      "version": "4.5.0",
+      "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz",
+      "integrity": "sha512-pDo3lu8Jhfjqls6GkMgpahsF9kCyayhgykjyLMNFTKWrpVdAQtYyB4muAMWozBB4ig/dtWAmsMxLEI8wuz+DYQ==",
+      "license": "MIT"
+    },
     "node_modules/loose-envify": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
@@ -1858,9 +1878,9 @@
       }
     },
     "node_modules/maplibre-gl": {
-      "version": "5.0.0-pre.1",
-      "resolved": "https://registry.npmjs.org/maplibre-gl/-/maplibre-gl-5.0.0-pre.1.tgz",
-      "integrity": "sha512-+J6W3RKQJiqGUmOsO42mS3ZyYxwhMwRaqh/DPfdhHcFXH49pZ16kZg0sBy4yvtJruasQA22WOZcRY/38ZUPihA==",
+      "version": "4.7.1",
+      "resolved": "https://registry.npmjs.org/maplibre-gl/-/maplibre-gl-4.7.1.tgz",
+      "integrity": "sha512-lgL7XpIwsgICiL82ITplfS7IGwrB1OJIw/pCvprDp2dhmSSEBgmPzYRvwYYYvJGJD7fxUv1Tvpih4nZ6VrLuaA==",
       "license": "BSD-3-Clause",
       "dependencies": {
         "@mapbox/geojson-rewind": "^0.5.2",
@@ -2031,9 +2051,9 @@
       }
     },
     "node_modules/pmtiles": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/pmtiles/-/pmtiles-3.1.0.tgz",
-      "integrity": "sha512-6JvgAQ8gElP1Ilg6ILM4KqleeKS+QcwpW8PXqhPWjRFmqF42yyUJ8sP3dZHQXm+G0HYXuw1kGlMTdVEs583pCQ==",
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/pmtiles/-/pmtiles-3.2.0.tgz",
+      "integrity": "sha512-4v3Nw5xeMxaUReLZQTz3PyM4VM/Lx/Xp/rc2GGEWMl0nqAmcb+gjyi+eOTwfPu8LnB0ash36hz0dV76uYvih5A==",
       "license": "BSD-3-Clause",
       "dependencies": {
         "@types/leaflet": "^1.9.8",
@@ -2134,6 +2154,12 @@
       "integrity": "sha512-RKJ22hX8mHe3Y6wH/N3wCM6BWtjaxIyyUIkpHOvfFnxdI4yD4tBXEBKSbriGujF6jnSVkJrffuo6vxACiSSxIw==",
       "license": "ISC"
     },
+    "node_modules/randomcolor": {
+      "version": "0.6.2",
+      "resolved": "https://registry.npmjs.org/randomcolor/-/randomcolor-0.6.2.tgz",
+      "integrity": "sha512-Mn6TbyYpFgwFuQ8KJKqf3bqqY9O1y37/0jgSK/61PUxV4QfIMv0+K2ioq8DfOjkBslcjwSzRfIDEXfzA9aCx7A==",
+      "license": "CC0"
+    },
     "node_modules/react": {
       "version": "18.2.0",
       "resolved": "https://registry.npmjs.org/react/-/react-18.2.0.tgz",
diff --git a/app/package.json b/app/package.json
index 49290233..aeb28717 100644
--- a/app/package.json
+++ b/app/package.json
@@ -13,9 +13,10 @@
     "format": "biome format --write src test --javascript-formatter-indent-style=space --json-formatter-indent-style=space"
   },
   "dependencies": {
-    "maplibre-gl": "5.0.0-pre.1",
+    "@maplibre/maplibre-gl-inspect": "^1.7.0",
+    "maplibre-gl": "4.7.1",
     "pixelmatch": "^5.3.0",
-    "pmtiles": "3.1.0",
+    "pmtiles": "3.2.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-dropzone": "^14.2.3",
diff --git a/app/src/MapViewComponent.tsx b/app/src/MapViewComponent.tsx
index 472dc8ac..5c659832 100644
--- a/app/src/MapViewComponent.tsx
+++ b/app/src/MapViewComponent.tsx
@@ -1,3 +1,5 @@
+import MaplibreInspect from "@maplibre/maplibre-gl-inspect";
+import "@maplibre/maplibre-gl-inspect/dist/maplibre-gl-inspect.css";
 import maplibregl from "maplibre-gl";
 import { MapGeoJSONFeature, StyleSpecification } from "maplibre-gl";
 import "maplibre-gl/dist/maplibre-gl.css";
@@ -175,7 +177,7 @@ function MapLibreView(props: {
       );
     }
 
-    const protocol = new pmtiles.Protocol();
+    const protocol = new pmtiles.Protocol({ metadata: true });
     protocolRef.current = protocol;
     maplibregl.addProtocol("pmtiles", protocol.tile);
 
@@ -199,6 +201,15 @@ function MapLibreView(props: {
       }),
     );
 
+    map.addControl(
+      new MaplibreInspect({
+        popup: new maplibregl.Popup({
+          closeButton: false,
+          closeOnClick: false,
+        }),
+      }),
+    );
+
     const popup = new maplibregl.Popup({
       closeButton: true,
       closeOnClick: false,