diff --git a/public/app/plugins/panel/geomap/layers/basemaps/carto.ts b/public/app/plugins/panel/geomap/layers/basemaps/carto.ts
index 1d1082e141f..45f65b2b267 100644
--- a/public/app/plugins/panel/geomap/layers/basemaps/carto.ts
+++ b/public/app/plugins/panel/geomap/layers/basemaps/carto.ts
@@ -45,10 +45,11 @@ export const carto: MapLayerRegistryItem<CartoConfig> = {
       } else {
         style += '_nolabels';
       }
+      const scale = window.devicePixelRatio > 1 ? '@2x' : '';
       return new TileLayer({
         source: new XYZ({
           attributions: `<a href="https://carto.com/attribution/">©CARTO</a> <a href="https://www.openstreetmap.org/copyright">©OpenStreetMap</a> contributors`,
-          url: `https://{1-4}.basemaps.cartocdn.com/${style}/{z}/{x}/{y}.png`,
+          url: `https://{1-4}.basemaps.cartocdn.com/${style}/{z}/{x}/{y}${scale}.png`,
         }),
       });
     },
diff --git a/public/app/plugins/panel/geomap/utils/utils.ts b/public/app/plugins/panel/geomap/utils/utils.ts
index 0e14164b413..23426d54db4 100644
--- a/public/app/plugins/panel/geomap/utils/utils.ts
+++ b/public/app/plugins/panel/geomap/utils/utils.ts
@@ -99,7 +99,7 @@ export const getNewOpenLayersMap = (panel: GeomapPanel, options: Options, div: H
   const view = panel.initMapView(options.view);
   return (panel.map = new OpenLayersMap({
     view: view,
-    pixelRatio: 1, // or zoom?
+    pixelRatio: window.devicePixelRatio, // or zoom?
     layers: [], // loaded explicitly below
     controls: [],
     target: div,