diff --git a/superset-frontend/plugins/legacy-preset-chart-nvd3/src/ReactNVD3.jsx b/superset-frontend/plugins/legacy-preset-chart-nvd3/src/ReactNVD3.jsx
index 507cc60fe6..9a9962e8aa 100644
--- a/superset-frontend/plugins/legacy-preset-chart-nvd3/src/ReactNVD3.jsx
+++ b/superset-frontend/plugins/legacy-preset-chart-nvd3/src/ReactNVD3.jsx
@@ -63,7 +63,7 @@ export default styled(NVD3)`
     }
     .nvtooltip tr.highlight td {
       font-weight: ${({ theme }) => theme.typography.weights.bold};
-      font-size: 15px !important;
+      font-size: ${({ theme }) => theme.typography.sizes.m}px !important;
     }
     text.nv-axislabel {
       font-size: ${({ theme }) => theme.typography.sizes.m} !important;
@@ -160,15 +160,15 @@ export default styled(NVD3)`
   .d3-tip.nv-event-annotation-layer-NATIVE {
     width: 200px;
     border-radius: 2px;
-    background-color: #484848;
+    background-color: ${({ theme }) => theme.colors.grayscale.base};
     fill-opacity: 0.6;
-    margin: 8px;
-    padding: 8px;
-    color: #fff;
+    margin: ${({ theme }) => theme.gridUnit * 2}px;
+    padding: ${({ theme }) => theme.gridUnit * 2}px;
+    color: ${({ theme }) => theme.colors.grayscale.light5};
     &:after {
       content: '\\25BC';
       font-size: ${({ theme }) => theme.typography.sizes.m};
-      color: #484848;
+      color: ${({ theme }) => theme.colors.grayscale.base};
       position: absolute;
       bottom: -14px;
       left: 94px;