diff --git a/core/src/components/card-subtitle/card-subtitle.ios.scss b/core/src/components/card-subtitle/card-subtitle.ios.scss
index 9210731064..b1d3eff6ed 100644
--- a/core/src/components/card-subtitle/card-subtitle.ios.scss
+++ b/core/src/components/card-subtitle/card-subtitle.ios.scss
@@ -5,7 +5,7 @@
 // --------------------------------------------------
 
 :host {
-  --ion-color-base: #{$card-ios-subtitle-color};
+  --color: #{$card-ios-subtitle-color};
 
   @include margin($card-ios-subtitle-margin-top, $card-ios-subtitle-margin-end, $card-ios-subtitle-margin-bottom, $card-ios-subtitle-margin-start);
   @include padding($card-ios-subtitle-padding-top, $card-ios-subtitle-padding-end, $card-ios-subtitle-padding-bottom, $card-ios-subtitle-padding-start);
diff --git a/core/src/components/card-subtitle/card-subtitle.md.scss b/core/src/components/card-subtitle/card-subtitle.md.scss
index 6ab6821c71..9100ec9bd9 100644
--- a/core/src/components/card-subtitle/card-subtitle.md.scss
+++ b/core/src/components/card-subtitle/card-subtitle.md.scss
@@ -5,7 +5,7 @@
 // --------------------------------------------------
 
 :host {
-  --ion-color-base: #{$card-md-subtitle-color};
+  --color: #{$card-md-subtitle-color};
 
   @include margin($card-md-subtitle-margin-top, $card-md-subtitle-margin-end, $card-md-subtitle-margin-bottom, $card-md-subtitle-margin-start);
   @include padding($card-md-subtitle-padding-top, $card-md-subtitle-padding-end, $card-md-subtitle-padding-bottom, $card-md-subtitle-padding-start);
diff --git a/core/src/components/card-subtitle/card-subtitle.scss b/core/src/components/card-subtitle/card-subtitle.scss
index 02efc788b9..80c50a72a1 100644
--- a/core/src/components/card-subtitle/card-subtitle.scss
+++ b/core/src/components/card-subtitle/card-subtitle.scss
@@ -4,8 +4,16 @@
 // --------------------------------------------------
 
 :host {
+  /**
+   * @prop --color: Color of the card subtitle
+   */
+
   display: block;
   position: relative;
 
-  color: #{current-color(base)};
+  color: var(--color);
 }
+
+:host(.ion-color) {
+  color: current-color(base);
+}
\ No newline at end of file