diff --git a/packages/scratch-gui/src/components/action-menu/action-menu.css b/packages/scratch-gui/src/components/action-menu/action-menu.css
index 03be98cace..f7dbc90258 100644
--- a/packages/scratch-gui/src/components/action-menu/action-menu.css
+++ b/packages/scratch-gui/src/components/action-menu/action-menu.css
@@ -140,10 +140,6 @@ button::-moz-focus-inner {
     font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
 }
 
-.tooltip:after {
-    background-color: $extensions-primary;
-}
-
 .coming-soon-tooltip {
     background-color: $data-primary !important;
 }
@@ -158,6 +154,7 @@ button::-moz-focus-inner {
     box-shadow: 0 0 .5rem hsla(0, 0%, 0%, .25) !important;
     font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
     z-index: $z-index-tooltip !important;
+    --tooltip-arrow-color: $extensions-primary;
 }
 
 $arrow-size: 0.5rem;
@@ -197,4 +194,4 @@ $arrow-rounding: 0.125rem;
     margin-left: $arrow-inset !important;
     top: $arrow-inset !important;
     transform: rotate(-45deg) !important;
-}
+}
\ No newline at end of file
diff --git a/packages/scratch-gui/src/components/action-menu/action-menu.jsx b/packages/scratch-gui/src/components/action-menu/action-menu.jsx
index f9e50f3ff6..60fe7700f0 100644
--- a/packages/scratch-gui/src/components/action-menu/action-menu.jsx
+++ b/packages/scratch-gui/src/components/action-menu/action-menu.jsx
@@ -138,6 +138,7 @@ class ActionMenu extends React.Component {
                     effect="solid"
                     id={this.mainTooltipId}
                     place={tooltipPlace || 'left'}
+                    arrowColor="var(--tooltip-arrow-color)"
                 />
                 <div className={styles.moreButtonsOuter}>
                     <div className={styles.moreButtons}>
@@ -179,6 +180,7 @@ class ActionMenu extends React.Component {
                                         effect="solid"
                                         id={tooltipId}
                                         place={tooltipPlace || 'left'}
+                                        arrowColor="var(--tooltip-arrow-color)"
                                     />
                                 </div>
                             );