diff --git a/packages/node_modules/@node-red/editor-client/src/sass/tabs.scss b/packages/node_modules/@node-red/editor-client/src/sass/tabs.scss
index 86bcee647..662aaa6ae 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/tabs.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/tabs.scss
@@ -104,7 +104,7 @@
                 }
 
                 .red-ui-tabs-fade {
-                    background-image: linear-gradient(to right, rgba(255,255,255,0.001), $tab-background-active);
+                    background-image: linear-gradient(to right, change-color($tab-background-active, $alpha: 0.001), $tab-background-active);
                 }
 
             }
@@ -112,7 +112,7 @@
                 &:not(.active) {
                     background: $tab-background-selected;
                     .red-ui-tabs-fade {
-                        background-image: linear-gradient(to right, rgba(255,255,255,0.001), $tab-background-selected);
+                        background-image: linear-gradient(to right, change-color($tab-background-selected, $alpha: 0.001), $tab-background-selected);
                     }
                     .red-ui-tabs-badge-selected {
                         background: $tab-background-selected;
@@ -308,7 +308,7 @@
     top: 0;
     right: 0;
     width: 15px;
-    background-image: linear-gradient(to right, rgba(255,255,255,0.001), $tab-background-inactive);
+    background-image: linear-gradient(to right, change-color($tab-background-inactive, $alpha: 0.001), $tab-background-inactive);
     pointer-events: none;
 }