diff --git a/packages/grafana-ui/src/components/Tooltip/_Tooltip.scss b/packages/grafana-ui/src/components/Tooltip/_Tooltip.scss
index f8002b5d0e1..8baf0719c42 100644
--- a/packages/grafana-ui/src/components/Tooltip/_Tooltip.scss
+++ b/packages/grafana-ui/src/components/Tooltip/_Tooltip.scss
@@ -13,6 +13,11 @@ $popper-margin-from-ref: 5px;
     background: darken($backgroundColor, 15%);
     color: lighten($textColor, 20%);
   }
+
+  strong,
+  em {
+    color: lighten($textColor, 20%);
+  }
 }
 
 .popper {
@@ -25,7 +30,7 @@ $popper-margin-from-ref: 5px;
 .popper__background {
   background: $tooltipBackground;
   border-radius: $border-radius-sm;
-  box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
+  box-shadow: $tooltipShadow;
   padding: $space-sm;
   color: $tooltipColor;
   font-weight: $font-weight-semi-bold;
diff --git a/packages/grafana-ui/src/themes/_variables.dark.scss.tmpl.ts b/packages/grafana-ui/src/themes/_variables.dark.scss.tmpl.ts
index f58636d1f74..5530194d172 100644
--- a/packages/grafana-ui/src/themes/_variables.dark.scss.tmpl.ts
+++ b/packages/grafana-ui/src/themes/_variables.dark.scss.tmpl.ts
@@ -282,30 +282,29 @@ $alert-success-bg: linear-gradient(90deg, $green-base, $green-shade);
 $alert-warning-bg: linear-gradient(90deg, $red-base, $red-shade);
 $alert-info-bg: linear-gradient(100deg, $blue-base, $blue-shade);
 
-// popover
+// Tooltips and popovers
+// -------------------------
+$tooltipColor: $text-color;
+$tooltipArrowWidth: 5px;
+$tooltipLinkColor: $link-color;
+$tooltipShadow: 0 0 10px black;
+$graph-tooltip-bg: $dark-1;
+
+$tooltipBackground: $gray15;
+$tooltipColor: $text-color;
+$tooltipArrowColor: $tooltipBackground;
+$tooltipBackgroundError: $brand-danger;
+
 $popover-bg: $dark-2;
 $popover-color: $text-color;
 $popover-border-color: $dark-9;
 $popover-header-bg: $dark-9;
 $popover-shadow: 0 0 20px black;
 
-$popover-help-bg: $btn-secondary-bg;
-$popover-help-color: $gray-6;
-
+$popover-help-bg: $tooltipBackground;
+$popover-help-color: $text-color;
 $popover-error-bg: $btn-danger-bg;
 
-// Tooltips and popovers
-// -------------------------
-$tooltipColor: $popover-help-color;
-$tooltipArrowWidth: 5px;
-$tooltipLinkColor: $link-color;
-$graph-tooltip-bg: $dark-1;
-
-$tooltipBackground: $black;
-$tooltipColor: $gray-4;
-$tooltipArrowColor: $tooltipBackground;
-$tooltipBackgroundError: $brand-danger;
-
 // images
 $checkboxImageUrl: '../img/checkbox.png';
 
diff --git a/packages/grafana-ui/src/themes/_variables.light.scss.tmpl.ts b/packages/grafana-ui/src/themes/_variables.light.scss.tmpl.ts
index ae4b96004a9..b3186ac7805 100644
--- a/packages/grafana-ui/src/themes/_variables.light.scss.tmpl.ts
+++ b/packages/grafana-ui/src/themes/_variables.light.scss.tmpl.ts
@@ -274,29 +274,26 @@ $alert-success-bg: linear-gradient(90deg, $green-base, $green-shade);
 $alert-warning-bg: linear-gradient(90deg, $red-base, $red-shade);
 $alert-info-bg: linear-gradient(100deg, $blue-base, $blue-shade);
 
-// popover
+// Tooltips and popovers
+$tooltipBackground: $gray-1;
+$tooltipColor: $gray-7;
+$tooltipArrowColor: $tooltipBackground; // Used by Angular tooltip
+$tooltipBackgroundError: $brand-danger;
+$tooltipShadow: 0 0 5px $gray60;
+$graph-tooltip-bg: $gray-5;
+
+$tooltipArrowWidth: 5px;
+$tooltipLinkColor: lighten($tooltipColor, 5%);
+
 $popover-bg: $page-bg;
 $popover-color: $text-color;
 $popover-border-color: $gray-5;
 $popover-header-bg: $gray-5;
 $popover-shadow: 0 0 20px $white;
 
-$popover-help-bg: $btn-secondary-bg;
-$popover-help-color: $gray-6;
-
 $popover-error-bg: $btn-danger-bg;
-
-// Tooltips and popovers
-// -------------------------
-$tooltipColor: $popover-help-color;
-$tooltipArrowWidth: 5px;
-$tooltipLinkColor: lighten($popover-help-color, 5%);
-$graph-tooltip-bg: $gray-5;
-
-$tooltipBackground: $gray-1;
-$tooltipColor: $gray-7;
-$tooltipArrowColor: $tooltipBackground; // Used by Angular tooltip
-$tooltipBackgroundError: $brand-danger;
+$popover-help-bg: $tooltipBackground;
+$popover-help-color: $tooltipColor;
 
 // images
 $checkboxImageUrl: '../img/checkbox_white.png';
diff --git a/public/sass/_variables.dark.generated.scss b/public/sass/_variables.dark.generated.scss
index ac18b892a82..7036daf5cfd 100644
--- a/public/sass/_variables.dark.generated.scss
+++ b/public/sass/_variables.dark.generated.scss
@@ -285,30 +285,29 @@ $alert-success-bg: linear-gradient(90deg, $green-base, $green-shade);
 $alert-warning-bg: linear-gradient(90deg, $red-base, $red-shade);
 $alert-info-bg: linear-gradient(100deg, $blue-base, $blue-shade);
 
-// popover
+// Tooltips and popovers
+// -------------------------
+$tooltipColor: $text-color;
+$tooltipArrowWidth: 5px;
+$tooltipLinkColor: $link-color;
+$tooltipShadow: 0 0 10px black;
+$graph-tooltip-bg: $dark-1;
+
+$tooltipBackground: $gray15;
+$tooltipColor: $text-color;
+$tooltipArrowColor: $tooltipBackground;
+$tooltipBackgroundError: $brand-danger;
+
 $popover-bg: $dark-2;
 $popover-color: $text-color;
 $popover-border-color: $dark-9;
 $popover-header-bg: $dark-9;
 $popover-shadow: 0 0 20px black;
 
-$popover-help-bg: $btn-secondary-bg;
-$popover-help-color: $gray-6;
-
+$popover-help-bg: $tooltipBackground;
+$popover-help-color: $text-color;
 $popover-error-bg: $btn-danger-bg;
 
-// Tooltips and popovers
-// -------------------------
-$tooltipColor: $popover-help-color;
-$tooltipArrowWidth: 5px;
-$tooltipLinkColor: $link-color;
-$graph-tooltip-bg: $dark-1;
-
-$tooltipBackground: $black;
-$tooltipColor: $gray-4;
-$tooltipArrowColor: $tooltipBackground;
-$tooltipBackgroundError: $brand-danger;
-
 // images
 $checkboxImageUrl: '../img/checkbox.png';
 
diff --git a/public/sass/_variables.light.generated.scss b/public/sass/_variables.light.generated.scss
index c93664deb2e..65ce98ca65c 100644
--- a/public/sass/_variables.light.generated.scss
+++ b/public/sass/_variables.light.generated.scss
@@ -277,29 +277,26 @@ $alert-success-bg: linear-gradient(90deg, $green-base, $green-shade);
 $alert-warning-bg: linear-gradient(90deg, $red-base, $red-shade);
 $alert-info-bg: linear-gradient(100deg, $blue-base, $blue-shade);
 
-// popover
+// Tooltips and popovers
+$tooltipBackground: $gray-1;
+$tooltipColor: $gray-7;
+$tooltipArrowColor: $tooltipBackground; // Used by Angular tooltip
+$tooltipBackgroundError: $brand-danger;
+$tooltipShadow: 0 0 5px $gray60;
+$graph-tooltip-bg: $gray-5;
+
+$tooltipArrowWidth: 5px;
+$tooltipLinkColor: lighten($tooltipColor, 5%);
+
 $popover-bg: $page-bg;
 $popover-color: $text-color;
 $popover-border-color: $gray-5;
 $popover-header-bg: $gray-5;
 $popover-shadow: 0 0 20px $white;
 
-$popover-help-bg: $btn-secondary-bg;
-$popover-help-color: $gray-6;
-
 $popover-error-bg: $btn-danger-bg;
-
-// Tooltips and popovers
-// -------------------------
-$tooltipColor: $popover-help-color;
-$tooltipArrowWidth: 5px;
-$tooltipLinkColor: lighten($popover-help-color, 5%);
-$graph-tooltip-bg: $gray-5;
-
-$tooltipBackground: $gray-1;
-$tooltipColor: $gray-7;
-$tooltipArrowColor: $tooltipBackground; // Used by Angular tooltip
-$tooltipBackgroundError: $brand-danger;
+$popover-help-bg: $tooltipBackground;
+$popover-help-color: $tooltipColor;
 
 // images
 $checkboxImageUrl: '../img/checkbox_white.png';