diff --git a/ui/src/app/widget/lib/google-map.js b/ui/src/app/widget/lib/google-map.js
index e783003f04..ef9d61b4d2 100644
--- a/ui/src/app/widget/lib/google-map.js
+++ b/ui/src/app/widget/lib/google-map.js
@@ -200,7 +200,7 @@ export default class TbGoogleMap {
                 map: this.map,
                 icon: pinImage,
                 shadow: pinShadow,
-                labelContent: '<b>'+settings.label+'</b>',
+                labelContent: '<div style="color: '+ settings.labelColor +';"><b>'+settings.label+'</b></div>',
                 labelClass: "tb-labels",
                 labelAnchor: new google.maps.Point(50, height + 20)
             });
diff --git a/ui/src/app/widget/lib/map-widget.js b/ui/src/app/widget/lib/map-widget.js
index 0a4eff0b2e..fdb7f1192b 100644
--- a/ui/src/app/widget/lib/map-widget.js
+++ b/ui/src/app/widget/lib/map-widget.js
@@ -99,6 +99,7 @@ export default class TbMapWidget {
                 lngKeyName: "lng",
                 showLabel: true,
                 label: "",
+                labelColor: ctx.widgetConfig.color || '#000000',
                 color: "#FE7569",
                 useColorFunction: false,
                 colorFunction: null,
diff --git a/ui/src/app/widget/lib/openstreet-map.js b/ui/src/app/widget/lib/openstreet-map.js
index 74438a4f77..aacb505c06 100644
--- a/ui/src/app/widget/lib/openstreet-map.js
+++ b/ui/src/app/widget/lib/openstreet-map.js
@@ -78,7 +78,7 @@ export default class TbOpenStreetMap {
             marker.setIcon(icon);
             if (settings.showLabel) {
                 marker.unbindTooltip();
-                marker.bindTooltip('<b>' + settings.label + '</b>',
+                marker.bindTooltip('<div style="color: '+ settings.labelColor +';"><b>'+settings.label+'</b></div>',
                     { className: 'tb-marker-label', permanent: true, direction: 'top', offset: [0, -height + 10] });
             }
         }
@@ -101,7 +101,7 @@ export default class TbOpenStreetMap {
         var marker = L.marker(location, {icon: icon}).addTo(this.map);
 
         if (settings.showLabel) {
-            marker.bindTooltip('<b>' + settings.label + '</b>',
+            marker.bindTooltip('<div style="color: '+ settings.labelColor +';"><b>'+settings.label+'</b></div>',
                 { className: 'tb-marker-label', permanent: true, direction: 'top', offset: [0, -height + 10] });
         }