diff --git a/frontend/src/metabase/css/core/colors.css b/frontend/src/metabase/css/core/colors.css
index 36d5dbf187dc4dbc251798242f967e38cfd7555c..fb3f68385cb53abd3900a30136a13b0984d4cef5 100644
--- a/frontend/src/metabase/css/core/colors.css
+++ b/frontend/src/metabase/css/core/colors.css
@@ -17,7 +17,7 @@
   --color-error: #ed6e6e;
   --color-warning: #f9cf48;
   --color-text-dark: #2e353b;
-  --color-text-medium: #a4adb3;
+  --color-text-medium: #74838f;
   --color-text-light: #c7cfd4;
   --color-text-white: #ffffff;
   --color-bg-black: #2e353b;
diff --git a/frontend/src/metabase/lib/colors.js b/frontend/src/metabase/lib/colors.js
index 220440f7f9d6097d4821b63e7eee238b07e906cb..8a40f5326993ddc2a48e4bf4a1ba09ecf1813344 100644
--- a/frontend/src/metabase/lib/colors.js
+++ b/frontend/src/metabase/lib/colors.js
@@ -29,7 +29,7 @@ const colors = {
   error: "#ED6E6E",
   warning: "#F9CF48",
   "text-dark": "#2E353B",
-  "text-medium": "#A4ADB3",
+  "text-medium": "#74838f",
   "text-light": "#C7CFD4",
   "text-white": "#FFFFFF",
   "bg-black": "#2E353B",
diff --git a/frontend/src/metabase/query_builder/components/notebook/NotebookStep.jsx b/frontend/src/metabase/query_builder/components/notebook/NotebookStep.jsx
index 9a875a9a28269a09c22f4566c29731feee3013b5..a3c530d816127405cc584a28b42d5b04177437cf 100644
--- a/frontend/src/metabase/query_builder/components/notebook/NotebookStep.jsx
+++ b/frontend/src/metabase/query_builder/components/notebook/NotebookStep.jsx
@@ -178,7 +178,7 @@ export default class NotebookStep extends React.Component {
                   className={!showPreviewButton ? "hidden disabled" : null}
                   icon="play"
                   title={t`Preview`}
-                  color={colors["text-medium"]}
+                  color={colors["text-light"]}
                   onClick={() => this.setState({ showPreview: true })}
                 />
               </Box>