diff --git a/src/material/button-toggle/_m2-button-toggle.scss b/src/material/button-toggle/_m2-button-toggle.scss
index f87c15e0b274..6d16c0347346 100644
--- a/src/material/button-toggle/_m2-button-toggle.scss
+++ b/src/material/button-toggle/_m2-button-toggle.scss
@@ -1,7 +1,6 @@
 @use 'sass:map';
 @use '../core/theming/theming';
 @use '../core/theming/inspection';
-@use '../core/style/sass-utils';
 @use '../core/tokens/m2-utils';
 
 // Tokens that can't be configured through Angular Material's current theming API,
@@ -47,8 +46,7 @@
     button-toggle-selected-state-background-color:
         inspection.get-theme-color($theme, background, selected-button),
     button-toggle-selected-state-text-color: inspection.get-theme-color($theme, system, on-surface),
-    button-toggle-state-layer-color: sass-utils.safe-color-change(
-        inspection.get-theme-color($theme, background, focused-button), $alpha: 1),
+    button-toggle-state-layer-color: inspection.get-theme-color($theme, background, base),
     button-toggle-text-color: inspection.get-theme-color($theme, system, on-surface),
   );
 }
diff --git a/src/material/button/_m2-button.scss b/src/material/button/_m2-button.scss
index 95b15efa0a5d..d912ebddaafa 100644
--- a/src/material/button/_m2-button.scss
+++ b/src/material/button/_m2-button.scss
@@ -48,24 +48,24 @@
   @return (
     button-filled-container-color: map.get($system, surface),
     button-filled-disabled-container-color:
-        inspection.get-theme-color($theme, foreground, disabled-button, 0.12),
+        inspection.get-theme-color($theme, foreground, base, 0.12),
     button-filled-disabled-label-text-color:
-        inspection.get-theme-color($theme, foreground, disabled-button, if($is-dark, 0.5, 0.38)),
+        inspection.get-theme-color($theme, foreground, base, if($is-dark, 0.5, 0.38)),
     button-filled-disabled-state-layer-color: inspection.get-theme-color($theme, foreground, base),
     button-filled-focus-state-layer-opacity: map.get($system, focus-state-layer-opacity),
     button-filled-hover-state-layer-opacity: map.get($system, hover-state-layer-opacity),
-    button-filled-label-text-color: inspection.get-theme-color($theme, foreground, text, 1),
+    button-filled-label-text-color: inspection.get-theme-color($theme, foreground, base),
     button-filled-pressed-state-layer-opacity: map.get($system, pressed-state-layer-opacity),
     button-filled-ripple-color: inspection.get-theme-color($theme, foreground, base, 0.1),
     button-filled-state-layer-color: inspection.get-theme-color($theme, foreground, base),
     button-outlined-disabled-label-text-color:
-        inspection.get-theme-color($theme, foreground, disabled-button, if($is-dark, 0.5, 0.38)),
+        inspection.get-theme-color($theme, foreground, base, if($is-dark, 0.5, 0.38)),
     button-outlined-disabled-outline-color: $outline,
     button-outlined-disabled-state-layer-color:
         inspection.get-theme-color($theme, foreground, base),
     button-outlined-focus-state-layer-opacity: map.get($system, focus-state-layer-opacity),
     button-outlined-hover-state-layer-opacity: map.get($system, hover-state-layer-opacity),
-    button-outlined-label-text-color: inspection.get-theme-color($theme, foreground, text, 1),
+    button-outlined-label-text-color: inspection.get-theme-color($theme, foreground, base),
     button-outlined-outline-color: $outline,
     button-outlined-pressed-state-layer-opacity:
         map.get($system, pressed-state-layer-opacity),
@@ -73,36 +73,36 @@
     button-outlined-state-layer-color: inspection.get-theme-color($theme, foreground, base),
     button-protected-container-color: map.get($system, surface),
     button-protected-disabled-container-color:
-        inspection.get-theme-color($theme, foreground, disabled-button, 0.12),
+        inspection.get-theme-color($theme, foreground, base, 0.12),
     button-protected-disabled-label-text-color:
-        inspection.get-theme-color($theme, foreground, disabled-button, if($is-dark, 0.5, 0.38)),
+        inspection.get-theme-color($theme, foreground, base, if($is-dark, 0.5, 0.38)),
     button-protected-disabled-state-layer-color:
         inspection.get-theme-color($theme, foreground, base),
     button-protected-focus-state-layer-opacity: map.get($system, focus-state-layer-opacity),
     button-protected-hover-state-layer-opacity: map.get($system, hover-state-layer-opacity),
-    button-protected-label-text-color: inspection.get-theme-color($theme, foreground, text, 1),
+    button-protected-label-text-color: inspection.get-theme-color($theme, foreground, base),
     button-protected-pressed-state-layer-opacity:
         map.get($system, pressed-state-layer-opacity),
     button-protected-ripple-color: inspection.get-theme-color($theme, foreground, base, 0.1),
     button-protected-state-layer-color: inspection.get-theme-color($theme, foreground, base),
     button-text-disabled-label-text-color:
-        inspection.get-theme-color($theme, foreground, disabled-button, if($is-dark, 0.5, 0.38)),
+        inspection.get-theme-color($theme, foreground, base, if($is-dark, 0.5, 0.38)),
     button-text-disabled-state-layer-color: inspection.get-theme-color($theme, foreground, base),
     button-text-focus-state-layer-opacity: map.get($system, focus-state-layer-opacity),
     button-text-hover-state-layer-opacity: map.get($system, hover-state-layer-opacity),
-    button-text-label-text-color: inspection.get-theme-color($theme, foreground, text, 1),
+    button-text-label-text-color: inspection.get-theme-color($theme, foreground, base),
     button-text-pressed-state-layer-opacity: map.get($system, pressed-state-layer-opacity),
     button-text-ripple-color: inspection.get-theme-color($theme, foreground, base, 0.1),
     button-text-state-layer-color: inspection.get-theme-color($theme, foreground, base),
     button-tonal-container-color: map.get($system, surface),
     button-tonal-disabled-container-color:
-        inspection.get-theme-color($theme, foreground, disabled-button, 0.12),
+        inspection.get-theme-color($theme, foreground, base, 0.12),
     button-tonal-disabled-label-text-color:
-        inspection.get-theme-color($theme, foreground, disabled-button, if($is-dark, 0.5, 0.38)),
+        inspection.get-theme-color($theme, foreground, base, if($is-dark, 0.5, 0.38)),
     button-tonal-disabled-state-layer-color: inspection.get-theme-color($theme, foreground, base),
     button-tonal-focus-state-layer-opacity: map.get($system, focus-state-layer-opacity),
     button-tonal-hover-state-layer-opacity: map.get($system, hover-state-layer-opacity),
-    button-tonal-label-text-color: inspection.get-theme-color($theme, foreground, text, 1),
+    button-tonal-label-text-color: inspection.get-theme-color($theme, foreground, base),
     button-tonal-pressed-state-layer-opacity: map.get($system, pressed-state-layer-opacity),
     button-tonal-ripple-color: inspection.get-theme-color($theme, foreground, base, 0.1),
     button-tonal-state-layer-color: inspection.get-theme-color($theme, foreground, base),
@@ -112,11 +112,11 @@
 // Generates the mapping for the properties that change based on the button palette color.
 @function private-get-color-palette-color-tokens($theme, $palette-name) {
   $color: inspection.get-theme-color($theme, $palette-name);
-  $state-layer-color: inspection.get-theme-color($theme, $palette-name, default-contrast, 1);
+  $state-layer-color: inspection.get-theme-color($theme, $palette-name, default-contrast);
   $ripple-color: inspection.get-theme-color($theme, $palette-name, default-contrast, 0.1);
   $contrast-color: inspection.get-theme-color($theme, $palette-name, default-contrast);
   $container-color: inspection.get-theme-color($theme, $palette-name, default);
-  $label-text-color: inspection.get-theme-color($theme, $palette-name, default-contrast, 1);
+  $label-text-color: inspection.get-theme-color($theme, $palette-name, default-contrast);
   $ripple-opacity: 0.1;
 
   // outlined-outline-color:
@@ -148,11 +148,11 @@
     button-text-state-layer-color: inspection.get-theme-color($theme, $palette-name),
     button-tonal-container-color: inspection.get-theme-color($theme, $palette-name, default),
     button-tonal-label-text-color:
-        inspection.get-theme-color($theme, $palette-name, default-contrast, 1),
+        inspection.get-theme-color($theme, $palette-name, default-contrast),
     button-tonal-ripple-color:
         inspection.get-theme-color($theme, $palette-name, default-contrast, 0.1),
     button-tonal-state-layer-color:
-        inspection.get-theme-color($theme, $palette-name, default-contrast, 1),
+        inspection.get-theme-color($theme, $palette-name, default-contrast),
   );
 }
 
diff --git a/src/material/button/_m2-fab.scss b/src/material/button/_m2-fab.scss
index 7b7b9a5184cb..3baf016d924c 100644
--- a/src/material/button/_m2-fab.scss
+++ b/src/material/button/_m2-fab.scss
@@ -35,9 +35,9 @@
   @return (
     fab-container-color: map.get($system, surface),
     fab-disabled-state-container-color:
-        inspection.get-theme-color($theme, background, disabled-button, 0.12),
+        inspection.get-theme-color($theme, foreground, base, 0.12),
     fab-disabled-state-foreground-color:
-        inspection.get-theme-color($theme, foreground, disabled-button, if($is-dark, 0.5, 0.38)),
+        inspection.get-theme-color($theme, foreground, base, if($is-dark, 0.5, 0.38)),
     fab-disabled-state-layer-color: inspection.get-theme-color($theme, foreground, base),
     fab-focus-state-layer-opacity: map.get($system, focus-state-layer-opacity),
     fab-foreground-color: inspection.get-theme-color($theme, foreground, base),
@@ -46,9 +46,9 @@
     fab-ripple-color: inspection.get-theme-color($theme, foreground, base, 0.1),
     fab-small-container-color: map.get($system, surface),
     fab-small-disabled-state-container-color:
-        inspection.get-theme-color($theme, background, disabled-button, 0.12),
+        inspection.get-theme-color($theme, foreground, base, 0.12),
     fab-small-disabled-state-foreground-color:
-        inspection.get-theme-color($theme, foreground, disabled-button, if($is-dark, 0.5, 0.38)),
+        inspection.get-theme-color($theme, foreground, base, if($is-dark, 0.5, 0.38)),
     fab-small-disabled-state-layer-color: inspection.get-theme-color($theme, foreground, base),
     fab-small-focus-state-layer-opacity: map.get($system, focus-state-layer-opacity),
     fab-small-foreground-color: inspection.get-theme-color($theme, foreground, base),
@@ -63,8 +63,8 @@
 // Generates the mapping for the properties that change based on the FAB palette color.
 @function private-get-color-palette-color-tokens($theme, $palette-name) {
   $contrast-color: inspection.get-theme-color($theme, $palette-name, default-contrast);
-  $foreground-color: inspection.get-theme-color($theme, $palette-name, default-contrast, 1);
-  $state-layer-color: inspection.get-theme-color($theme, $palette-name, default-contrast, 1);
+  $foreground-color: inspection.get-theme-color($theme, $palette-name, default-contrast);
+  $state-layer-color: inspection.get-theme-color($theme, $palette-name, default-contrast);
   $ripple-color: inspection.get-theme-color($theme, $palette-name, default-contrast, 0.1);
 
   @return (
diff --git a/src/material/checkbox/_m2-checkbox.scss b/src/material/checkbox/_m2-checkbox.scss
index 3db4cbf7cc28..1fd37654b874 100644
--- a/src/material/checkbox/_m2-checkbox.scss
+++ b/src/material/checkbox/_m2-checkbox.scss
@@ -2,7 +2,6 @@
 @use '../core/tokens/m2-utils';
 @use '../core/theming/theming';
 @use '../core/theming/inspection';
-@use '../core/style/sass-utils';
 @use '../core/m2/theming' as m2-theming;
 @use '../core/m2/palette' as m2-palette;
 
@@ -29,15 +28,13 @@
   $is-dark: inspection.get-theme-type($theme) == dark;
   $foreground-base: inspection.get-theme-color($theme, foreground, base);
   $palette-default: inspection.get-theme-color($theme, $palette-name, default);
-  $disabled-color: sass-utils.safe-color-change(
-      inspection.get-theme-color($theme, foreground, base), $alpha: 0.38);
+  $disabled-color: inspection.get-theme-color($theme, foreground, base, 0.38);
   $palette-selected: inspection.get-theme-color($theme, $palette-name);
-  $border-color: sass-utils.safe-color-change(
-      inspection.get-theme-color($theme, foreground, base), $alpha: 0.54);
+  $border-color: inspection.get-theme-color($theme, foreground, base, 0.54);
   $active-border-color:
     m2-theming.get-color-from-palette(m2-palette.$gray-palette, if($is-dark, 200, 900));
   $selected-checkmark-color:
-    inspection.get-theme-color($theme, $palette-name, default-contrast, 1);
+    inspection.get-theme-color($theme, $palette-name, default-contrast);
 
   $tokens: (
     checkbox-disabled-label-color: inspection.get-theme-color($theme, foreground, disabled-text),
diff --git a/src/material/core/m2/_theming.scss b/src/material/core/m2/_theming.scss
index dc930eac9cb7..fce4161cad80 100644
--- a/src/material/core/m2/_theming.scss
+++ b/src/material/core/m2/_theming.scss
@@ -85,14 +85,16 @@
   // might be inferred as numbers by Sass. Casting them to string fixes the map lookup.
   $color: if(map.has-key($palette, $hue), map.get($palette, $hue), map.get($palette, $hue + ''));
 
-  @if (meta.type-of($color) != color) {
-    // If the $color resolved to something different from a color (e.g. a CSS variable),
-    // we can't apply the opacity anyway so we return the value as is, otherwise Sass can
-    // throw an error or output something invalid.
+  @if ($opacity == null) {
     @return $color;
   }
 
-  @return rgba($color, if($opacity == null, color.opacity($color), $opacity));
+  @if (meta.type-of($color) != color) {
+    $opacity: ($opacity * 100) + '%';
+    @return #{color-mix(in srgb, #{$color} #{$opacity}, transparent)};
+  }
+
+  @return rgba($color, $opacity);
 }
 
 // Validates the specified theme by ensuring that the optional color config defines
diff --git a/src/material/core/style/_form-common.scss b/src/material/core/style/_form-common.scss
index fcb697d667c0..3c7f9aa20df7 100644
--- a/src/material/core/style/_form-common.scss
+++ b/src/material/core/style/_form-common.scss
@@ -1,5 +1,4 @@
 @use '../theming/inspection';
-@use './sass-utils';
 
 // Renders a gradient for showing the dashed line when the input is disabled.
 // Unlike using a border, a gradient allows us to adjust the spacing of the dotted line
@@ -15,7 +14,6 @@
 // becoming out of sync since these colors aren't in a palette.
 @function private-control-placeholder-color($theme) {
   $is-dark-theme: inspection.get-theme-type($theme) == dark;
-  @return sass-utils.safe-color-change(
-      inspection.get-theme-color($theme, foreground, secondary-text),
-      $alpha: if($is-dark-theme, 0.5, 0.42));
+  @return
+      inspection.get-theme-color($theme, foreground, base, if($is-dark-theme, 0.5, 0.42));
 }
diff --git a/src/material/core/style/_sass-utils.scss b/src/material/core/style/_sass-utils.scss
index e2ff89eb952f..2bc7a72ac72f 100644
--- a/src/material/core/style/_sass-utils.scss
+++ b/src/material/core/style/_sass-utils.scss
@@ -1,4 +1,3 @@
-@use 'sass:color';
 @use 'sass:string';
 @use 'sass:map';
 @use 'sass:meta';
@@ -51,34 +50,6 @@ $use-system-typography-variables: false;
   @return $result;
 }
 
-/// A version of the Sass `color.change` function that is safe ot use with CSS variables.
-@function safe-color-change($color, $args...) {
-  $args: meta.keywords($args);
-  $use-color-mix: $use-system-color-variables or
-      (is-css-var-name($color) and string.index($color, '--mat') == 1);
-  @if (meta.type-of($color) == 'color') {
-    @return color.change($color, $args...);
-  }
-  @else if ($color != null and
-      map.get($args, alpha) != null and $use-color-mix) {
-    $opacity: map.get($args, alpha);
-    @if meta.type-of($opacity) == number {
-      $opacity: ($opacity * 100) + '%';
-    }
-
-    @if (is-css-var-name($opacity)) {
-      $opacity: calc(var($opacity) * 100%);
-    }
-
-    @if (is-css-var-name($color)) {
-      $color: var($color);
-    }
-
-    @return #{color-mix(in srgb, #{$color} #{$opacity}, transparent)};
-  }
-  @return $color;
-}
-
 // Returns whether the $value is a CSS variable name based on whether it's a string prefixed
 // by "--".
 @function is-css-var-name($value) {
diff --git a/src/material/datepicker/_m2-datepicker.scss b/src/material/datepicker/_m2-datepicker.scss
index bbbf7878052c..120d71592305 100644
--- a/src/material/datepicker/_m2-datepicker.scss
+++ b/src/material/datepicker/_m2-datepicker.scss
@@ -70,7 +70,7 @@ $private-default-overlap-color: #a8dab5;
     datepicker-toggle-icon-color: $inactive-icon-color,
     datepicker-calendar-body-label-text-color: $secondary-text-color,
     datepicker-calendar-period-button-text-color:
-        inspection.get-theme-color($theme, foreground, text, 1),
+        inspection.get-theme-color($theme, foreground, base),
     datepicker-calendar-period-button-icon-color: $inactive-icon-color,
     datepicker-calendar-navigation-button-icon-color: $inactive-icon-color,
     datepicker-calendar-header-divider-color: inspection.get-theme-color($theme, system, outline),
@@ -140,7 +140,7 @@ $private-default-overlap-color: #a8dab5;
 @function private-get-calendar-color-palette-color-tokens($theme, $palette-name) {
   $palette-color: inspection.get-theme-color($theme, $palette-name);
   $default-contrast: inspection.get-theme-color($theme, $palette-name, default-contrast);
-  $active-background-color: sass-utils.safe-color-change($palette-color, $alpha: 0.3);
+  $active-background-color: inspection.get-theme-color($theme, $palette-name, 0.3);
   $active-disabled-color: null;
 
   @if (meta.type-of($palette-color) == color) {
diff --git a/src/material/dialog/_m2-dialog.scss b/src/material/dialog/_m2-dialog.scss
index abee3b35aa3a..2f7c9f0614dd 100644
--- a/src/material/dialog/_m2-dialog.scss
+++ b/src/material/dialog/_m2-dialog.scss
@@ -1,5 +1,4 @@
 @use '../core/style/elevation';
-@use '../core/style/sass-utils';
 @use '../core/theming/inspection';
 
 // Tokens that can't be configured through Angular Material's current theming API,
@@ -25,12 +24,10 @@
 // Tokens that can be configured through Angular Material's color theming API.
 @function get-color-tokens($theme) {
   $is-dark: inspection.get-theme-type($theme) == dark;
-  $text-base: inspection.get-theme-color($theme, foreground, text, 1);
-
   @return (
     dialog-container-color: inspection.get-theme-color($theme, system, surface),
-    dialog-subhead-color: sass-utils.safe-color-change($text-base, $alpha: 0.87),
-    dialog-supporting-text-color: sass-utils.safe-color-change($text-base, $alpha: 0.6),
+    dialog-subhead-color: inspection.get-theme-color($theme, foreground, base, 0.87),
+    dialog-supporting-text-color: inspection.get-theme-color($theme, foreground, base, 0.6),
   );
 }
 
diff --git a/src/material/form-field/_m2-form-field.scss b/src/material/form-field/_m2-form-field.scss
index 1c7d5b596310..8c0b5c9f6492 100644
--- a/src/material/form-field/_m2-form-field.scss
+++ b/src/material/form-field/_m2-form-field.scss
@@ -1,5 +1,4 @@
 @use '../core/m2/palette' as m2-palette;
-@use '../core/style/sass-utils';
 @use '../core/tokens/m2-utils';
 @use '../core/theming/inspection';
 @use '../core/theming/theming';
@@ -30,14 +29,12 @@
   $warn-color: inspection.get-theme-color($theme, warn);
   $color-tokens: private-get-color-palette-color-tokens($theme, primary);
   $on-surface: if($is-dark, #fff, #000);
-  $text-color-base: inspection.get-theme-color($theme, system, on-surface);
-  $disabled-text-color-base: inspection.get-theme-color($theme, foreground, disabled-text, 1);
-  $divider-base: inspection.get-theme-color($theme, foreground, base);
+  $disabled: inspection.get-theme-color($theme, foreground, base, 0.38);
 
   @return map.merge($color-tokens, (
     // MDC has a token for the enabled placeholder, but not for the disabled one.
     form-field-disabled-input-text-placeholder-color:
-      inspection.get-theme-color($theme, foreground, icon, 0.38),
+      inspection.get-theme-color($theme, foreground, base, 0.38),
     form-field-state-layer-color: inspection.get-theme-color($theme, foreground, base, 0.87),
     form-field-error-text-color: inspection.get-theme-color($theme, warn),
 
@@ -66,58 +63,58 @@
     form-field-error-hover-trailing-icon-color: unset,
     form-field-error-trailing-icon-color: unset,
     form-field-enabled-select-arrow-color:
-        inspection.get-theme-color($theme, foreground, icon, 0.54),
+        inspection.get-theme-color($theme, foreground, base, 0.54),
     form-field-disabled-select-arrow-color:
-        inspection.get-theme-color($theme, foreground, icon, 0.38),
+        inspection.get-theme-color($theme, foreground, base, 0.38),
     form-field-hover-state-layer-opacity: map.get($system, hover-state-layer-opacity),
     form-field-focus-state-layer-opacity: map.get($system, focus-state-layer-opacity),
     form-field-filled-container-color: _variable-safe-mix($on-surface, $surface, 4%),
     form-field-filled-disabled-container-color: _variable-safe-mix($on-surface, $surface, 2%),
-    form-field-filled-label-text-color: sass-utils.safe-color-change($text-color-base, $alpha: 0.6),
+    form-field-filled-label-text-color: inspection.get-theme-color($theme, foreground, base, 0.6),
     form-field-filled-hover-label-text-color:
-        sass-utils.safe-color-change($text-color-base, $alpha: 0.6),
+        inspection.get-theme-color($theme, foreground, base, 0.6),
     form-field-filled-disabled-label-text-color:
-        sass-utils.safe-color-change($disabled-text-color-base, $alpha: 0.38),
+        inspection.get-theme-color($theme, foreground, base, 0.38),
     form-field-filled-input-text-color:
-        sass-utils.safe-color-change($text-color-base, $alpha: 0.87),
+        inspection.get-theme-color($theme, foreground, base, 0.87),
     form-field-filled-disabled-input-text-color:
-        sass-utils.safe-color-change($disabled-text-color-base, $alpha: 0.38),
+        inspection.get-theme-color($theme, foreground, base, 0.38),
     form-field-filled-input-text-placeholder-color:
-        sass-utils.safe-color-change($text-color-base, $alpha: 0.6),
+        inspection.get-theme-color($theme, foreground, base, 0.6),
     form-field-filled-error-hover-label-text-color: $warn-color,
     form-field-filled-error-focus-label-text-color: $warn-color,
     form-field-filled-error-label-text-color: $warn-color,
     form-field-filled-error-caret-color: $warn-color,
     form-field-filled-active-indicator-color:
-        sass-utils.safe-color-change($divider-base, $alpha: 0.42),
+        inspection.get-theme-color($theme, foreground, base, 0.42),
     form-field-filled-disabled-active-indicator-color:
-        sass-utils.safe-color-change($divider-base, $alpha: 0.06),
+        inspection.get-theme-color($theme, foreground, base, 0.06),
     form-field-filled-hover-active-indicator-color:
-        sass-utils.safe-color-change($divider-base, $alpha: 0.87),
+        inspection.get-theme-color($theme, foreground, base, 0.87),
     form-field-filled-error-active-indicator-color: $warn-color,
     form-field-filled-error-focus-active-indicator-color: $warn-color,
     form-field-filled-error-hover-active-indicator-color: $warn-color,
     form-field-outlined-label-text-color:
-        sass-utils.safe-color-change($text-color-base, $alpha: 0.6),
+        inspection.get-theme-color($theme, foreground, base, 0.6),
     form-field-outlined-hover-label-text-color:
-        sass-utils.safe-color-change($text-color-base, $alpha: 0.6),
+        inspection.get-theme-color($theme, foreground, base, 0.6),
     form-field-outlined-disabled-label-text-color:
-        sass-utils.safe-color-change($disabled-text-color-base, $alpha: 0.38),
+        inspection.get-theme-color($theme, foreground, base, 0.38),
     form-field-outlined-input-text-color:
-        sass-utils.safe-color-change($text-color-base, $alpha: 0.87),
+        inspection.get-theme-color($theme, foreground, base, 0.87),
     form-field-outlined-disabled-input-text-color:
-        sass-utils.safe-color-change($disabled-text-color-base, $alpha: 0.38),
+        inspection.get-theme-color($theme, foreground, base, 0.38),
     form-field-outlined-input-text-placeholder-color:
-        sass-utils.safe-color-change($text-color-base, $alpha: 0.6),
+        inspection.get-theme-color($theme, foreground, base, 0.6),
     form-field-outlined-error-caret-color: $warn-color,
     form-field-outlined-error-focus-label-text-color: $warn-color,
     form-field-outlined-error-label-text-color: $warn-color,
     form-field-outlined-error-hover-label-text-color: $warn-color,
-    form-field-outlined-outline-color: sass-utils.safe-color-change($divider-base, $alpha: 0.38),
+    form-field-outlined-outline-color: inspection.get-theme-color($theme, foreground, base, 0.38),
     form-field-outlined-disabled-outline-color:
-        sass-utils.safe-color-change($divider-base, $alpha: 0.06),
+        inspection.get-theme-color($theme, foreground, base, 0.06),
     form-field-outlined-hover-outline-color:
-        sass-utils.safe-color-change($divider-base, $alpha: 0.87),
+        inspection.get-theme-color($theme, foreground, base, 0.87),
     form-field-outlined-error-focus-outline-color: $warn-color,
     form-field-outlined-error-hover-outline-color: $warn-color,
     form-field-outlined-error-outline-color: $warn-color,
@@ -134,17 +131,16 @@
 // Generates the mapping for the properties that change based on the form field color.
 @function private-get-color-palette-color-tokens($theme, $palette-name) {
   $palette-color: inspection.get-theme-color($theme, $palette-name);
+  $text-color: inspection.get-theme-color($theme, $palette-name, 0.87);
 
   @return (
-    form-field-focus-select-arrow-color: sass-utils.safe-color-change($palette-color, $alpha: 0.87),
+    form-field-focus-select-arrow-color: $text-color,
     form-field-filled-caret-color: $palette-color,
     form-field-filled-focus-active-indicator-color: $palette-color,
-    form-field-filled-focus-label-text-color:
-        sass-utils.safe-color-change($palette-color, $alpha: 0.87),
+    form-field-filled-focus-label-text-color: $text-color,
     form-field-outlined-caret-color: $palette-color,
     form-field-outlined-focus-outline-color: $palette-color,
-    form-field-outlined-focus-label-text-color:
-        sass-utils.safe-color-change($palette-color, $alpha: 0.87),
+    form-field-outlined-focus-label-text-color: $text-color,
   );
 }
 
diff --git a/src/material/list/_m2-list.scss b/src/material/list/_m2-list.scss
index f18acf22953b..c7c66ee919cc 100644
--- a/src/material/list/_m2-list.scss
+++ b/src/material/list/_m2-list.scss
@@ -1,4 +1,3 @@
-@use '../core/style/sass-utils';
 @use '../core/theming/inspection';
 @use 'sass:map';
 @use '../core/tokens/m2-utils';
@@ -34,8 +33,8 @@
   $foreground-text: map.get($system, on-surface);
   $foreground-secondary-text: inspection.get-theme-color($theme, foreground, secondary-text);
   $foreground-hint-text: inspection.get-theme-color($theme, foreground, hint-text);
-  $text-icon-on-background: sass-utils.safe-color-change(
-      $foreground-base, $alpha: if($is-dark, 0.5, 0.38));
+  $text-icon-on-background:
+      inspection.get-theme-color($theme, foreground, base, if($is-dark, 0.5, 0.38));
 
   @return (
     list-list-item-label-text-color: $foreground-text,
diff --git a/src/material/paginator/_m2-paginator.scss b/src/material/paginator/_m2-paginator.scss
index afb899160cfc..30395ed81efa 100644
--- a/src/material/paginator/_m2-paginator.scss
+++ b/src/material/paginator/_m2-paginator.scss
@@ -2,7 +2,6 @@
 @use 'sass:map';
 @use '../core/theming/theming';
 @use '../core/theming/inspection';
-@use '../core/style/sass-utils';
 
 // Tokens that can't be configured through Angular Material's current theming API,
 // but may be in a future version of the theming API.
@@ -12,13 +11,11 @@
 
 // Tokens that can be configured through Angular Material's color theming API.
 @function get-color-tokens($theme) {
-  $foreground-base: inspection.get-theme-color($theme, foreground, base);
-
   @return (
-    paginator-container-text-color: sass-utils.safe-color-change($foreground-base, $alpha: 0.87),
+    paginator-container-text-color: inspection.get-theme-color($theme, foreground, base, 0.87),
     paginator-container-background-color: inspection.get-theme-color($theme, system, surface),
-    paginator-enabled-icon-color: sass-utils.safe-color-change($foreground-base, $alpha: 0.54),
-    paginator-disabled-icon-color: sass-utils.safe-color-change($foreground-base, $alpha: 0.12),
+    paginator-enabled-icon-color: inspection.get-theme-color($theme, foreground, base, 0.54),
+    paginator-disabled-icon-color: inspection.get-theme-color($theme, foreground, base, 0.12),
   );
 }
 
diff --git a/src/material/radio/_m2-radio.scss b/src/material/radio/_m2-radio.scss
index d916b3db0ca4..d0007df154ee 100644
--- a/src/material/radio/_m2-radio.scss
+++ b/src/material/radio/_m2-radio.scss
@@ -26,8 +26,8 @@
   @return (
     radio-checked-ripple-color: inspection.get-theme-color($theme, $palette-name, default),
     radio-disabled-label-color: inspection.get-theme-color($theme, foreground, disabled-text),
-    radio-disabled-selected-icon-color: inspection.get-theme-color($theme, foreground, icon, 1),
-    radio-disabled-unselected-icon-color: inspection.get-theme-color($theme, foreground, icon, 1),
+    radio-disabled-selected-icon-color: inspection.get-theme-color($theme, foreground, base),
+    radio-disabled-unselected-icon-color: inspection.get-theme-color($theme, foreground, base),
     radio-label-text-color: inspection.get-theme-color($theme, system, on-surface),
     radio-ripple-color: inspection.get-theme-color($theme, foreground, base),
     radio-selected-focus-icon-color: $palette-color,
@@ -36,8 +36,8 @@
     radio-selected-pressed-icon-color: $palette-color,
     radio-unselected-focus-icon-color: $icon-color,
     radio-unselected-hover-icon-color: $icon-color,
-    radio-unselected-icon-color: inspection.get-theme-color($theme, foreground, icon, 0.54),
-    radio-unselected-pressed-icon-color: inspection.get-theme-color($theme, foreground, icon, 0.54),
+    radio-unselected-icon-color: inspection.get-theme-color($theme, foreground, base, 0.54),
+    radio-unselected-pressed-icon-color: inspection.get-theme-color($theme, foreground, base, 0.54),
   );
 }
 
diff --git a/src/material/select/_m2-select.scss b/src/material/select/_m2-select.scss
index 18f1b9e2e6eb..0c4dc5b46464 100644
--- a/src/material/select/_m2-select.scss
+++ b/src/material/select/_m2-select.scss
@@ -2,7 +2,6 @@
 @use '../core/theming/inspection';
 @use '../core/theming/theming';
 @use '../core/style/elevation';
-@use '../core/style/sass-utils';
 
 // Tokens that can't be configured through Angular Material's current theming API,
 // but may be in a future version of the theming API.
@@ -14,23 +13,15 @@
 
 // Tokens that can be configured through Angular Material's color theming API.
 @function get-color-tokens($theme, $palette-name: primary) {
-  $is-dark: inspection.get-theme-type($theme) == dark;
-  $text-color-base: inspection.get-theme-color($theme, foreground, text, 1);
-  $disabled-text-color-base: inspection.get-theme-color($theme, foreground, disabled-text, 1);
-  $icon-color-base: inspection.get-theme-color($theme, foreground, base);
-
   @return (
     select-panel-background-color: inspection.get-theme-color($theme, system, surface),
-    select-enabled-trigger-text-color: sass-utils.safe-color-change($text-color-base, $alpha: 0.87),
-    select-disabled-trigger-text-color:
-      sass-utils.safe-color-change($disabled-text-color-base, $alpha: 0.38),
-    select-placeholder-text-color: sass-utils.safe-color-change($text-color-base, $alpha: 0.6),
-    select-enabled-arrow-color: sass-utils.safe-color-change($icon-color-base, $alpha: 0.54),
-    select-disabled-arrow-color: sass-utils.safe-color-change($text-color-base, $alpha: 0.38),
-    select-focused-arrow-color: sass-utils.safe-color-change(
-      inspection.get-theme-color($theme, $palette-name, default), $alpha: 0.87),
-    select-invalid-arrow-color: sass-utils.safe-color-change(
-      inspection.get-theme-color($theme, warn, default), $alpha: 0.87),
+    select-enabled-trigger-text-color: inspection.get-theme-color($theme, foreground, base, 0.87),
+    select-disabled-trigger-text-color: inspection.get-theme-color($theme, foreground, base, 0.38),
+    select-placeholder-text-color: inspection.get-theme-color($theme, foreground, base, 0.6),
+    select-enabled-arrow-color: inspection.get-theme-color($theme, foreground, base, 0.54),
+    select-disabled-arrow-color: inspection.get-theme-color($theme, foreground, base, 0.38),
+    select-focused-arrow-color: inspection.get-theme-color($theme, $palette-name, default, 0.87),
+    select-invalid-arrow-color: inspection.get-theme-color($theme, warn, default, 0.87),
   );
 }
 
diff --git a/src/material/sidenav/_m2-sidenav.scss b/src/material/sidenav/_m2-sidenav.scss
index 4282e1109b72..863c93d2330f 100644
--- a/src/material/sidenav/_m2-sidenav.scss
+++ b/src/material/sidenav/_m2-sidenav.scss
@@ -2,7 +2,6 @@
 @use 'sass:meta';
 @use '../core/theming/inspection';
 @use '../core/style/elevation';
-@use '../core/style/sass-utils';
 
 // Tokens that can't be configured through Angular Material's current theming API,
 // but may be in a future version of the theming API.
@@ -20,8 +19,7 @@
 @function get-color-tokens($theme) {
   $is-dark: inspection.get-theme-type($theme) ==  dark;
   $scrim-opacity: 0.6;
-  $scrim-color: sass-utils.safe-color-change(
-      inspection.get-theme-color($theme, system, surface), $alpha: $scrim-opacity);
+  $scrim-color: inspection.get-theme-color($theme, system, surface, $scrim-opacity);
   $fallback-scrim-color: if($is-dark, rgba(#fff, $scrim-opacity), rgba(#000, $scrim-opacity));
 
   @return (
diff --git a/src/material/tabs/_m2-tabs.scss b/src/material/tabs/_m2-tabs.scss
index a1f2d877d0d3..1fbaadd48691 100644
--- a/src/material/tabs/_m2-tabs.scss
+++ b/src/material/tabs/_m2-tabs.scss
@@ -26,13 +26,13 @@
 // Tokens that can be configured through Angular Material's color theming API.
 @function get-color-tokens($theme, $palette-name: primary, $exclude: ()) {
   $is-dark: inspection.get-theme-type($theme) == dark;
-  $inactive-label-text-color: inspection.get-theme-color($theme, foreground, text, 0.6);
+  $inactive-label-text-color: inspection.get-theme-color($theme, foreground, base, 0.6);
   $active-label-text-color: inspection.get-theme-color($theme, $palette-name, default);
   $ripple-color: inspection.get-theme-color($theme, $palette-name, default);
 
   $tokens: (
     tab-disabled-ripple-color: inspection.get-theme-color($theme, foreground, disabled),
-    tab-pagination-icon-color: inspection.get-theme-color($theme, foreground, icon, 1),
+    tab-pagination-icon-color: inspection.get-theme-color($theme, foreground, base),
 
     // Note: MDC has equivalents of these tokens, but they lead to much higher selector specificity.
     tab-inactive-label-text-color: $inactive-label-text-color,