diff --git a/core/src/components/button/button.ionic.scss b/core/src/components/button/button.ionic.scss
index d4386b5e57..2cd5f7b55b 100644
--- a/core/src/components/button/button.ionic.scss
+++ b/core/src/components/button/button.ionic.scss
@@ -107,7 +107,7 @@
 
 :host(.button-outline.ion-color) ion-ripple-effect,
 :host(.button-clear.ion-color) ion-ripple-effect {
-  color: var(--ion-color-subtle-shade, #{globals.current-color(shade, $subtle: true)});
+  color: globals.current-color(shade, $subtle: true);
 }
 
 // Button Sizes