diff --git a/packages/eui-theme-borealis/changelogs/upcoming/8966.md b/packages/eui-theme-borealis/changelogs/upcoming/8966.md
new file mode 100644
index 00000000000..3115da86748
--- /dev/null
+++ b/packages/eui-theme-borealis/changelogs/upcoming/8966.md
@@ -0,0 +1,4 @@
+**Bug fixes**
+
+- Fixed the syntax of the SCSS variable `$euiColorTransparent` to ensure a valid value
+
diff --git a/packages/eui-theme-borealis/src/variables/colors/_semantic_colors.scss b/packages/eui-theme-borealis/src/variables/colors/_semantic_colors.scss
index 016176d7014..f2886af6e00 100644
--- a/packages/eui-theme-borealis/src/variables/colors/_semantic_colors.scss
+++ b/packages/eui-theme-borealis/src/variables/colors/_semantic_colors.scss
@@ -9,7 +9,7 @@ $euiColorWhite: #FFFFFF !default;
 $euiColorBlack: #000000 !default;
 $euiColorMutedBlack: #0E0F12 !default;
 $euiColorBlueBlack: #050F21 !default;
-$euiColorTransparent: 'transparent' !default;
+$euiColorTransparent: transparent !default;
 
 $euiColorPlainLight: $euiColorWhite !default;
 $euiColorPlainDark: $euiColorBlueBlack !default;
diff --git a/packages/eui/changelogs/upcoming/8966.md b/packages/eui/changelogs/upcoming/8966.md
new file mode 100644
index 00000000000..3115da86748
--- /dev/null
+++ b/packages/eui/changelogs/upcoming/8966.md
@@ -0,0 +1,4 @@
+**Bug fixes**
+
+- Fixed the syntax of the SCSS variable `$euiColorTransparent` to ensure a valid value
+
diff --git a/packages/eui/src/themes/amsterdam/_colors_dark.scss b/packages/eui/src/themes/amsterdam/_colors_dark.scss
index 5ddc5b947db..f76c4a655e7 100644
--- a/packages/eui/src/themes/amsterdam/_colors_dark.scss
+++ b/packages/eui/src/themes/amsterdam/_colors_dark.scss
@@ -121,8 +121,8 @@ $euiColorBorderBaseFloating: $euiColorLightShade !default;
 $euiColorBorderBaseFormsColorSwatch: transparentize($euiColorFullShade, 0.1) !default;
 $euiColorBorderBaseFormsControl: tint($euiColorLightestShade, 0.31) !default;
 
-$euiColorBorderInteractiveFormsHoverPlain: 'transparent' !default;
-$euiColorBorderInteractiveFormsHoverDanger: 'transparent' !default;
+$euiColorBorderInteractiveFormsHoverPlain: transparent !default;
+$euiColorBorderInteractiveFormsHoverDanger: transparent !default;
 
 $euiColorBorderStrongPrimary: $euiColorPrimary !default;
 $euiColorBorderStrongAccent: $euiColorAccent !default;
diff --git a/packages/eui/src/themes/amsterdam/_colors_light.scss b/packages/eui/src/themes/amsterdam/_colors_light.scss
index ad4c440fdc5..f4ed2f9d667 100644
--- a/packages/eui/src/themes/amsterdam/_colors_light.scss
+++ b/packages/eui/src/themes/amsterdam/_colors_light.scss
@@ -117,12 +117,12 @@ $euiColorBorderBaseDanger: tint($euiColorDanger, 0.6) !default;
 $euiColorBorderBasePlain: $euiColorLightShade !default;
 $euiColorBorderBaseSubdued: $euiColorLightShade !default;
 $euiColorBorderBaseDisabled: transparentize(darken($euiColorLightShade, 40%), 0.1) !default;
-$euiColorBorderBaseFloating: 'transparent' !default;
+$euiColorBorderBaseFloating: transparent !default;
 $euiColorBorderBaseFormsColorSwatch: transparentize($euiColorFullShade, 0.1) !default;
 $euiColorBorderBaseFormsControl: shade($euiColorLightestShade, 0.4) !default;
 
-$euiColorBorderInteractiveFormsHoverPlain: 'transparent' !default;
-$euiColorBorderInteractiveFormsHoverDanger: 'transparent' !default;
+$euiColorBorderInteractiveFormsHoverPlain: transparent !default;
+$euiColorBorderInteractiveFormsHoverDanger: transparent !default;
 
 $euiColorBorderStrongPrimary: $euiColorPrimary !default;
 $euiColorBorderStrongAccent: $euiColorAccent !default;