diff --git a/.stylelintrc.json b/.stylelintrc.json
index f0267172a95d..29b064b77863 100644
--- a/.stylelintrc.json
+++ b/.stylelintrc.json
@@ -150,7 +150,9 @@
         "**/_button-theme.scss",
         "**/_card-theme.scss",
         "**/_checkbox-theme.scss",
+        "**/_column-resize-theme.scss",
         "**/_core-theme.scss",
+        "**/_datepicker-theme.scss",
         "**/_fab-theme.scss",
         "**/_form-field-theme.scss",
         "**/_icon-button-theme.scss",
@@ -159,12 +161,16 @@
         "**/_optgroup-theme.scss",
         "**/_option-theme.scss",
         "**/_paginator-theme.scss",
+        "**/_popover-edit-theme.scss",
         "**/_progress-bar-theme.scss",
         "**/_pseudo-checkbox-theme.scss",
         "**/_radio-theme.scss",
         "**/_ripple-theme.scss",
         "**/_slide-toggle-theme.scss",
-        "**/_slider-theme.scss"
+        "**/_slider-theme.scss",
+        "**/_sort-theme.scss",
+        "**/_stepper-theme.scss",
+        "**/_tree-theme.scss"
       ],
       "rules": {
         "material/theme-mixin-api": false
diff --git a/src/material-experimental/column-resize/_column-resize-theme.scss b/src/material-experimental/column-resize/_column-resize-theme.scss
index 62132e2b2510..da557219419b 100644
--- a/src/material-experimental/column-resize/_column-resize-theme.scss
+++ b/src/material-experimental/column-resize/_column-resize-theme.scss
@@ -1,14 +1,9 @@
-@use 'sass:map';
 @use '@angular/material' as mat;
 
-@mixin color($config-or-theme) {
-  $config: mat.get-color-config($config-or-theme);
-  $primary: map.get($config, primary);
-  $foreground: map.get($config, foreground);
-
-  $non-resizable-hover-divider: mat.get-color-from-palette($foreground, divider);
-  $resizable-hover-divider: mat.get-color-from-palette($primary, 600);
-  $resizable-active-divider: mat.get-color-from-palette($primary, 600);
+@mixin color($theme) {
+  $non-resizable-hover-divider: mat.private-get-theme-color($theme, foreground, divider);
+  $resizable-hover-divider: mat.private-get-theme-color($theme, primary, 600);
+  $resizable-active-divider: mat.private-get-theme-color($theme, primary, 600);
 
   // TODO: these styles don't really belong in the `color` part of the theme.
   // We should figure out a better place for them.
@@ -135,25 +130,20 @@
   }
 }
 
-@mixin typography($config-or-theme) {}
+@mixin typography($theme) {}
 
-@mixin density($config-or-theme) {}
+@mixin density($theme) {}
 
-@mixin theme($theme-or-color-config) {
-  $theme: mat.private-legacy-get-theme($theme-or-color-config);
+@mixin theme($theme) {
   @include mat.private-check-duplicate-theme-styles($theme, 'mat-column-resize') {
-    $color: mat.get-color-config($theme);
-    $density: mat.get-density-config($theme);
-    $typography: mat.get-typography-config($theme);
-
-    @if $color != null {
-      @include color($color);
+    @if mat.private-theme-has($theme, color) {
+      @include color($theme);
     }
-    @if $density != null {
-      @include density($density);
+    @if mat.private-theme-has($theme, density) {
+      @include density($theme);
     }
-    @if $typography != null {
-      @include typography($typography);
+    @if mat.private-theme-has($theme, typography) {
+      @include typography($theme);
     }
   }
 }
diff --git a/src/material-experimental/popover-edit/_popover-edit-theme.scss b/src/material-experimental/popover-edit/_popover-edit-theme.scss
index eb39cc9c683e..102ceaf5683d 100644
--- a/src/material-experimental/popover-edit/_popover-edit-theme.scss
+++ b/src/material-experimental/popover-edit/_popover-edit-theme.scss
@@ -1,4 +1,3 @@
-@use 'sass:map';
 @use '@angular/cdk';
 @use '@angular/material' as mat;
 
@@ -6,12 +5,8 @@
   @return linear-gradient($direction, rgba($background-color, 0), $background-color 8px);
 }
 
-@mixin color($config-or-theme) {
-  $config: mat.get-color-config($config-or-theme);
-  $background: map.get($config, background);
-  $foreground: map.get($config, foreground);
-  $primary: map.get($config, primary);
-  $background-color: mat.get-color-from-palette($background, 'card');
+@mixin color($theme) {
+  $background-color: mat.private-get-theme-color($theme, background, 'card');
 
   // TODO: these structural styles don't belong in the `color` part of a theme.
   // We should figure out a better place for them.
@@ -47,7 +42,7 @@
     position: relative;
 
     &::after {
-      background-color: mat.get-color-from-palette($primary);
+      background-color: mat.private-get-theme-color($theme, primary);
       bottom: 0;
       content: '';
       height: 2px;
@@ -81,9 +76,9 @@
   }
 
   .mat-edit-pane {
-    @include mat.private-theme-elevation(2, $config);
+    @include mat.private-theme-elevation(2, $theme);
     background: $background-color;
-    color: mat.get-color-from-palette($foreground, text);
+    color: mat.private-get-theme-color($theme, foreground, text);
     display: block;
     padding: 16px 24px;
 
@@ -147,32 +142,26 @@
   }
 }
 
-@mixin typography($config-or-theme) {
-  $config: mat.private-typography-to-2018-config(
-      mat.get-typography-config($config-or-theme));
+@mixin typography($theme) {
   [mat-edit-title] {
-    @include mat.typography-level($config, headline-6);
+    font: mat.private-get-theme-typography($theme, headline-6, font);
+    letter-spacing: mat.private-get-theme-typography($theme, headline-6, letter-spacing);
   }
 }
 
 
-@mixin density($config-or-theme) {}
+@mixin density($theme) {}
 
-@mixin theme($theme-or-color-config) {
-  $theme: mat.private-legacy-get-theme($theme-or-color-config);
+@mixin theme($theme) {
   @include mat.private-check-duplicate-theme-styles($theme, 'mat-popover-edit') {
-    $color: mat.get-color-config($theme);
-    $density: mat.get-density-config($theme);
-    $typography: mat.get-typography-config($theme);
-
-    @if $color != null {
-      @include color($color);
+    @if mat.private-theme-has($theme, color) {
+      @include color($theme);
     }
-    @if $density != null {
-      @include density($density);
+    @if mat.private-theme-has($theme, density) {
+      @include density($theme);
     }
-    @if $typography != null {
-      @include typography($typography);
+    @if mat.private-theme-has($theme, typography) {
+      @include typography($theme);
     }
   }
 }
diff --git a/src/material/core/color/_all-color.scss b/src/material/core/color/_all-color.scss
index 4672471e5eb9..79241610ea54 100644
--- a/src/material/core/color/_all-color.scss
+++ b/src/material/core/color/_all-color.scss
@@ -1,25 +1,17 @@
 @use '../theming/all-theme';
-@use '../theming/theming';
+@use '../theming/inspection';
 
 // Includes all of the color styles.
-@mixin all-component-colors($config-or-theme) {
-  // In case a theme object has been passed instead of a configuration for
-  // the color system, extract the color config from the theme object.
-  $config: if(theming.private-is-theme-object($config-or-theme),
-      theming.get-color-config($config-or-theme), $config-or-theme);
-
-  @if $config == null {
+@mixin all-component-colors($theme) {
+  @if not inspection.theme-has($theme, color) {
     @error 'No color configuration specified.';
   }
 
-  @include all-theme.all-component-themes((
-    color: $config,
-    typography: null,
-    density: null,
-  ));
+  @include all-theme.all-component-themes(
+      inspection.theme-remove($theme, base, typography, density));
 }
 
 // @deprecated Use `all-component-colors`.
-@mixin angular-material-color($config-or-theme) {
-  @include all-component-colors($config-or-theme);
+@mixin angular-material-color($theme) {
+  @include all-component-colors($theme);
 }
diff --git a/src/material/core/density/private/_all-density.scss b/src/material/core/density/private/_all-density.scss
index 2da6bc84f1ea..d05f73adc38d 100644
--- a/src/material/core/density/private/_all-density.scss
+++ b/src/material/core/density/private/_all-density.scss
@@ -1,4 +1,4 @@
-@use '../../theming/theming';
+@use '../../theming/inspection';
 @use '../../../button/button-theme';
 @use '../../../button/icon-button-theme';
 @use '../../../button/fab-theme';
@@ -30,13 +30,8 @@
 @use '../../../table/table-theme';
 
 // Includes all of the density styles.
-@mixin all-component-densities($config-or-theme) {
-  // In case a theme object has been passed instead of a configuration for
-  // the density system, extract the density config from the theme object.
-  $config: if(theming.private-is-theme-object($config-or-theme),
-      theming.get-density-config($config-or-theme), $config-or-theme);
-
-  @if $config == null {
+@mixin all-component-densities($theme) {
+  @if not inspection.theme-has($theme, density) {
     @error 'No density configuration specified.';
   }
 
@@ -45,39 +40,39 @@
   // not possible as it would introduce a circular dependency for density because the `mat-core`
   // mixin that is transitively loaded by the `all-theme` file, imports `all-density` which
   // would then load `all-theme` again. This ultimately results a circular dependency.
-  @include form-field-theme.density($config);
-  @include card-theme.density($config);
-  @include progress-bar-theme.density($config);
-  @include progress-spinner-theme.density($config);
-  @include tooltip-theme.density($config);
-  @include input-theme.density($config);
-  @include core-theme.density($config);
-  @include select-theme.density($config);
-  @include checkbox-theme.density($config);
-  @include autocomplete-theme.density($config);
-  @include dialog-theme.density($config);
-  @include chips-theme.density($config);
-  @include slide-toggle-theme.density($config);
-  @include radio-theme.density($config);
-  @include slider-theme.density($config);
-  @include menu-theme.density($config);
-  @include list-theme.density($config);
-  @include paginator-theme.density($config);
-  @include tabs-theme.density($config);
-  @include snack-bar-theme.density($config);
-  @include button-theme.density($config);
-  @include icon-button-theme.density($config);
-  @include fab-theme.density($config);
-  @include table-theme.density($config);
-  @include expansion-theme.density($config);
-  @include stepper-theme.density($config);
-  @include toolbar-theme.density($config);
-  @include tree-theme.density($config);
-  @include button-toggle-theme.density($config);
+  @include form-field-theme.density($theme);
+  @include card-theme.density($theme);
+  @include progress-bar-theme.density($theme);
+  @include progress-spinner-theme.density($theme);
+  @include tooltip-theme.density($theme);
+  @include input-theme.density($theme);
+  @include core-theme.density($theme);
+  @include select-theme.density($theme);
+  @include checkbox-theme.density($theme);
+  @include autocomplete-theme.density($theme);
+  @include dialog-theme.density($theme);
+  @include chips-theme.density($theme);
+  @include slide-toggle-theme.density($theme);
+  @include radio-theme.density($theme);
+  @include slider-theme.density($theme);
+  @include menu-theme.density($theme);
+  @include list-theme.density($theme);
+  @include paginator-theme.density($theme);
+  @include tabs-theme.density($theme);
+  @include snack-bar-theme.density($theme);
+  @include button-theme.density($theme);
+  @include icon-button-theme.density($theme);
+  @include fab-theme.density($theme);
+  @include table-theme.density($theme);
+  @include expansion-theme.density($theme);
+  @include stepper-theme.density($theme);
+  @include toolbar-theme.density($theme);
+  @include tree-theme.density($theme);
+  @include button-toggle-theme.density($theme);
 }
 
 
 // @deprecated Use `all-component-densities`.
-@mixin angular-material-density($config-or-theme) {
-  @include all-component-densities($config-or-theme);
+@mixin angular-material-density($theme) {
+  @include all-component-densities($theme);
 }
diff --git a/src/material/core/focus-indicators/_private.scss b/src/material/core/focus-indicators/_private.scss
index 8cd7070e7cd0..c982c58dcc35 100644
--- a/src/material/core/focus-indicators/_private.scss
+++ b/src/material/core/focus-indicators/_private.scss
@@ -3,6 +3,7 @@
 @use '@angular/cdk';
 @use '../style/layout-common';
 @use '../theming/theming';
+@use '../theming/inspection';
 
 // Private sass variables that will be used as reference throughout component stylesheets.
 $default-border-width: 3px;
@@ -113,65 +114,60 @@ $default-border-radius: 4px;
   @include customize-focus-indicators($config, 'mat-mdc');
 }
 
-@mixin strong-focus-indicators-color($config-or-theme-or-color) {
-  @if meta.type-of($config-or-theme-or-color) == 'color' {
+@mixin strong-focus-indicators-color($theme-or-color) {
+  @if meta.type-of($theme-or-color) == 'color' {
     @include customize-focus-indicators((
-        border-color: $config-or-theme-or-color
+        border-color: $theme-or-color
     ), 'mat');
   }
   @else {
-    $config: theming.get-color-config($config-or-theme-or-color);
-    $border-color: theming.get-color-from-palette(map.get($config, primary));
+    $border-color: inspection.get-theme-color($theme-or-color, primary);
     @include customize-focus-indicators((
         border-color: $border-color
     ), 'mat');
   }
 }
 
-@mixin strong-focus-indicators-theme($theme-or-color-config-or-color) {
-  @if meta.type-of($theme-or-color-config-or-color) == 'color' {
+@mixin strong-focus-indicators-theme($theme-or-color) {
+  @if meta.type-of($theme-or-color) == 'color' {
     @include customize-focus-indicators((
-        border-color: $theme-or-color-config-or-color
+        border-color: $theme-or-color
     ), 'mat');
   }
   @else {
-    $theme: theming.private-legacy-get-theme($theme-or-color-config-or-color);
-    @include theming.private-check-duplicate-theme-styles($theme, 'mat-focus-indicators') {
-      $color: theming.get-color-config($theme);
-      @if $color != null {
-        @include strong-focus-indicators-color($color);
+    @include theming.private-check-duplicate-theme-styles($theme-or-color, 'mat-focus-indicators') {
+      @if inspection.theme-has($theme-or-color, color) {
+        @include strong-focus-indicators-color($theme-or-color);
       }
     }
   }
 }
 
-@mixin mdc-strong-focus-indicators-color($config-or-theme-or-color) {
-  @if meta.type-of($config-or-theme-or-color) == 'color' {
+@mixin mdc-strong-focus-indicators-color($theme-or-color) {
+  @if meta.type-of($theme-or-color) == 'color' {
     @include customize-focus-indicators((
-        border-color: $config-or-theme-or-color
+        border-color: $theme-or-color
     ), 'mat-mdc');
   }
   @else {
-    $config: theming.get-color-config($config-or-theme-or-color);
-    $border-color: theming.get-color-from-palette(map.get($config, primary));
+    $border-color: inspection.get-theme-color($theme-or-color, primary);
     @include customize-focus-indicators((
         border-color: $border-color
     ), 'mat-mdc');
   }
 }
 
-@mixin mdc-strong-focus-indicators-theme($theme-or-color-config-or-color) {
-  @if meta.type-of($theme-or-color-config-or-color) == 'color' {
+@mixin mdc-strong-focus-indicators-theme($theme-or-color) {
+  @if meta.type-of($theme-or-color) == 'color' {
     @include customize-focus-indicators((
-        border-color: $theme-or-color-config-or-color
+        border-color: $theme-or-color
     ), 'mat-mdc');
   }
   @else {
-    $theme: theming.private-legacy-get-theme($theme-or-color-config-or-color);
-    @include theming.private-check-duplicate-theme-styles($theme, 'mat-mdc-focus-indicators') {
-      $color: theming.get-color-config($theme);
-      @if $color != null {
-        @include mdc-strong-focus-indicators-color($color);
+    @include theming.private-check-duplicate-theme-styles(
+        $theme-or-color, 'mat-mdc-focus-indicators') {
+      @if inspection.theme-has($theme-or-color, color) {
+        @include mdc-strong-focus-indicators-color($theme-or-color);
       }
     }
   }
diff --git a/src/material/core/theming/_all-theme.scss b/src/material/core/theming/_all-theme.scss
index 20570dc21f00..4d3f32a4ae2f 100644
--- a/src/material/core/theming/_all-theme.scss
+++ b/src/material/core/theming/_all-theme.scss
@@ -39,50 +39,50 @@
 @use './theming';
 
 // Create a theme.
-@mixin all-component-themes($theme-or-color-config) {
+@mixin all-component-themes($theme) {
   $dedupe-key: 'angular-material-theme';
-  @include theming.private-check-duplicate-theme-styles($theme-or-color-config, $dedupe-key) {
-    @include core-theme.theme($theme-or-color-config);
-    @include card-theme.theme($theme-or-color-config);
-    @include progress-bar-theme.theme($theme-or-color-config);
-    @include tooltip-theme.theme($theme-or-color-config);
-    @include form-field-theme.theme($theme-or-color-config);
-    @include input-theme.theme($theme-or-color-config);
-    @include select-theme.theme($theme-or-color-config);
-    @include autocomplete-theme.theme($theme-or-color-config);
-    @include dialog-theme.theme($theme-or-color-config);
-    @include chips-theme.theme($theme-or-color-config);
-    @include slide-toggle-theme.theme($theme-or-color-config);
-    @include radio-theme.theme($theme-or-color-config);
-    @include slider-theme.theme($theme-or-color-config);
-    @include menu-theme.theme($theme-or-color-config);
-    @include list-theme.theme($theme-or-color-config);
-    @include paginator-theme.theme($theme-or-color-config);
-    @include tabs-theme.theme($theme-or-color-config);
-    @include checkbox-theme.theme($theme-or-color-config);
-    @include button-theme.theme($theme-or-color-config);
-    @include icon-button-theme.theme($theme-or-color-config);
-    @include fab-theme.theme($theme-or-color-config);
-    @include snack-bar-theme.theme($theme-or-color-config);
-    @include table-theme.theme($theme-or-color-config);
-    @include progress-spinner-theme.theme($theme-or-color-config);
-    @include badge-theme.theme($theme-or-color-config);
-    @include bottom-sheet-theme.theme($theme-or-color-config);
-    @include button-toggle-theme.theme($theme-or-color-config);
-    @include datepicker-theme.theme($theme-or-color-config);
-    @include divider-theme.theme($theme-or-color-config);
-    @include expansion-theme.theme($theme-or-color-config);
-    @include grid-list-theme.theme($theme-or-color-config);
-    @include icon-theme.theme($theme-or-color-config);
-    @include sidenav-theme.theme($theme-or-color-config);
-    @include stepper-theme.theme($theme-or-color-config);
-    @include sort-theme.theme($theme-or-color-config);
-    @include toolbar-theme.theme($theme-or-color-config);
-    @include tree-theme.theme($theme-or-color-config);
+  @include theming.private-check-duplicate-theme-styles($theme, $dedupe-key) {
+    @include core-theme.theme($theme);
+    @include card-theme.theme($theme);
+    @include progress-bar-theme.theme($theme);
+    @include tooltip-theme.theme($theme);
+    @include form-field-theme.theme($theme);
+    @include input-theme.theme($theme);
+    @include select-theme.theme($theme);
+    @include autocomplete-theme.theme($theme);
+    @include dialog-theme.theme($theme);
+    @include chips-theme.theme($theme);
+    @include slide-toggle-theme.theme($theme);
+    @include radio-theme.theme($theme);
+    @include slider-theme.theme($theme);
+    @include menu-theme.theme($theme);
+    @include list-theme.theme($theme);
+    @include paginator-theme.theme($theme);
+    @include tabs-theme.theme($theme);
+    @include checkbox-theme.theme($theme);
+    @include button-theme.theme($theme);
+    @include icon-button-theme.theme($theme);
+    @include fab-theme.theme($theme);
+    @include snack-bar-theme.theme($theme);
+    @include table-theme.theme($theme);
+    @include progress-spinner-theme.theme($theme);
+    @include badge-theme.theme($theme);
+    @include bottom-sheet-theme.theme($theme);
+    @include button-toggle-theme.theme($theme);
+    @include datepicker-theme.theme($theme);
+    @include divider-theme.theme($theme);
+    @include expansion-theme.theme($theme);
+    @include grid-list-theme.theme($theme);
+    @include icon-theme.theme($theme);
+    @include sidenav-theme.theme($theme);
+    @include stepper-theme.theme($theme);
+    @include sort-theme.theme($theme);
+    @include toolbar-theme.theme($theme);
+    @include tree-theme.theme($theme);
   }
 }
 
 // @deprecated Use `all-component-themes`.
-@mixin angular-material-theme($theme-or-color-config) {
-  @include all-component-themes($theme-or-color-config);
+@mixin angular-material-theme($theme) {
+  @include all-component-themes($theme);
 }
diff --git a/src/material/core/theming/_inspection.scss b/src/material/core/theming/_inspection.scss
index bfba7324d3ee..989280cc095d 100644
--- a/src/material/core/theming/_inspection.scss
+++ b/src/material/core/theming/_inspection.scss
@@ -231,6 +231,41 @@ $_typography-properties: (font, font-family, line-height, font-size, letter-spac
   }
 }
 
+/// Removes the information about the given theming system(s) from the given theme.
+/// @param {Map} $theme The theme to remove information from
+/// @param {String...} $systems The systems to remove
+/// @return {Map} A version of the theme without the removed theming systems.
+@function theme-remove($theme, $systems...) {
+  $err: validation.validate-allowed-values($systems, color, typography, density, base);
+  @if $err {
+    @error #{'Expected $systems to contain valid system names (color, typography, density, or'}
+    #{'base). Got invalid system names:'} $err;
+  }
+  $version: get-theme-version($theme);
+  @if $version == 0 {
+    @return m2-inspection.theme-remove($theme, $systems...);
+  }
+  @else if $version == 1 {
+    @each $system in $systems {
+      @if $system == base {
+        $theme: map.deep-remove($theme, $_internals, base-tokens);
+      }
+      @else if $system == color {
+        $theme: map.deep-remove($theme, $_internals, color-tokens);
+        $theme: map.deep-remove($theme, $_internals, theme-type);
+        $theme: map.deep-remove($theme, $_internals, palettes);
+      }
+      @else if $system == typography {
+        $theme: map.deep-remove($theme, $_internals, typography-tokens);
+      }
+      @else if $system == density {
+        $theme: map.deep-remove($theme, $_internals, density-scale);
+      }
+    }
+    @return $theme;
+  }
+}
+
 /// Gets the set of tokens from the given theme, limited to those affected by the requested theming
 /// systems.
 /// @param {Map} $theme The theme to get tokens from.
diff --git a/src/material/core/theming/_m2-inspection.scss b/src/material/core/theming/_m2-inspection.scss
index 64b7b86ca633..dabec39d9137 100644
--- a/src/material/core/theming/_m2-inspection.scss
+++ b/src/material/core/theming/_m2-inspection.scss
@@ -209,3 +209,27 @@ $_typography-properties: (font, font-family, line-height, font-size, letter-spac
   }
   @error 'Valid systems are: base, color, typography, density. Got:' $system;
 }
+
+/// Removes the information about the given theming system(s) from the given theme.
+/// @param {Map} $theme The theme to remove information from
+/// @param {String...} $systems The systems to remove
+/// @return {Map} A version of the theme without the removed theming systems.
+@function theme-remove($theme, $systems...) {
+  $internal: map.get($theme, $_internals, m2-config);
+  @each $system in $systems {
+    @if $system == color {
+      $theme: map.set($theme, color, null);
+    }
+    @else if $system == typography {
+      $theme: map.set($theme, typography, null);
+    }
+    @else if $system == density {
+      $theme: map.set($theme, density, null);
+    }
+  }
+  @if $internal {
+    $internal: theme-remove($internal, $systems...);
+    $theme: map.set($theme, $_internals, m2-config, $internal);
+  }
+  @return $theme;
+}
diff --git a/src/material/core/tokens/m2/mat/_datepicker.scss b/src/material/core/tokens/m2/mat/_datepicker.scss
index eb752266b18e..d69074ac54a1 100644
--- a/src/material/core/tokens/m2/mat/_datepicker.scss
+++ b/src/material/core/tokens/m2/mat/_datepicker.scss
@@ -1,10 +1,8 @@
 @use 'sass:color';
-@use 'sass:map';
 @use 'sass:meta';
 @use 'sass:math';
 @use '../../token-utils';
-@use '../../../theming/theming';
-@use '../../../typography/typography-utils';
+@use '../../../theming/inspection';
 @use '../../../style/sass-utils';
 
 // The prefix used to generate the fully qualified name for tokens in this file.
@@ -36,23 +34,20 @@ $private-default-overlap-color: #a8dab5;
 }
 
 // Tokens that can be configured through Angular Material's color theming API.
-@function get-color-tokens($config) {
-  $foreground: map.get($config, foreground);
-  $background: map.get($config, background);
-  $primary: map.get($config, primary);
-  $inactive-icon-color: theming.get-color-from-palette($foreground, icon);
-  $text-color: theming.get-color-from-palette($foreground, text);
-  $secondary-text-color: theming.get-color-from-palette($foreground, secondary-text);
-  $disabled-text-color: theming.get-color-from-palette($foreground, disabled-text);
-  $divider-color: theming.get-color-from-palette($foreground, divider);
-  $hint-text-color: theming.get-color-from-palette($foreground, hint-text);
+@function get-color-tokens($theme) {
+  $inactive-icon-color: inspection.get-theme-color($theme, foreground, icon);
+  $text-color: inspection.get-theme-color($theme, foreground, text);
+  $secondary-text-color: inspection.get-theme-color($theme, foreground, secondary-text);
+  $disabled-text-color: inspection.get-theme-color($theme, foreground, disabled-text);
+  $divider-color: inspection.get-theme-color($theme, foreground, divider);
+  $hint-text-color: inspection.get-theme-color($theme, foreground, hint-text);
   $preview-outline-color: $divider-color;
   $today-disabled-outline-color: null;
 
-  $primary-color: theming.get-color-from-palette(map.get($config, primary));
+  $primary-color: inspection.get-theme-color($theme, primary);
   $range-tokens: get-range-color-tokens(private-get-range-background-color($primary-color));
-  $calendar-tokens: private-get-calendar-color-palette-color-tokens($config, primary);
-  $toggle-tokens: private-get-toggle-color-palette-color-tokens($config, primary);
+  $calendar-tokens: private-get-calendar-color-palette-color-tokens($theme, primary);
+  $toggle-tokens: private-get-toggle-color-palette-color-tokens($theme, primary);
 
   // The divider color is set under the assumption that it'll be used
   // for a solid border, but because we're using a dashed border for the
@@ -90,31 +85,30 @@ $private-default-overlap-color: #a8dab5;
     range-input-disabled-state-separator-color: $disabled-text-color,
     range-input-disabled-state-text-color: $disabled-text-color,
 
-    calendar-container-background-color: theming.get-color-from-palette($background, card),
+    calendar-container-background-color: inspection.get-theme-color($theme, background, card),
     calendar-container-text-color: $text-color,
   ));
 }
 
 // Tokens that can be configured through Angular Material's typography theming API.
-@function get-typography-tokens($config) {
-  $fallback-font: typography-utils.font-family($config);
-
+@function get-typography-tokens($theme) {
   @return (
     // TODO(crisbeto): the typography tokens for other components set every typography dimension of
     // an element (e.g. size, weight, line height, letter spacing). These tokens only set the values
     // that were set in the previous theming API to reduce the amount of subtle screenshot
     // differences. We should look into introducing the other tokens in a follow-up.
-    calendar-text-font: $fallback-font,
+    calendar-text-font: inspection.get-theme-typography($theme, body-1, font-family),
     calendar-text-size: 13px, // TODO(crisbeto): this doesn't appear to affect anything
 
-    calendar-body-label-text-size: typography-utils.font-size($config, button),
-    calendar-body-label-text-weight: typography-utils.font-weight($config, button),
+    calendar-body-label-text-size: inspection.get-theme-typography($theme, button, font-size),
+    calendar-body-label-text-weight: inspection.get-theme-typography($theme, button, font-weight),
 
-    calendar-period-button-text-size: typography-utils.font-size($config, button),
-    calendar-period-button-text-weight: typography-utils.font-weight($config, button),
+    calendar-period-button-text-size: inspection.get-theme-typography($theme, button, font-size),
+    calendar-period-button-text-weight: inspection.get-theme-typography(
+        $theme, button, font-weight),
 
     calendar-header-text-size: 11px,
-    calendar-header-text-weight: typography-utils.font-weight($config, body-1),
+    calendar-header-text-weight: inspection.get-theme-typography($theme, body-1, font-weight),
   );
 }
 
@@ -133,19 +127,17 @@ $private-default-overlap-color: #a8dab5;
   );
 }
 
-@function private-get-calendar-color-palette-color-tokens($config, $palette-name) {
-  $foreground: map.get($config, foreground);
-  $palette: map.get($config, $palette-name);
-  $palette-color: theming.get-color-from-palette($palette);
-  $default-contrast: theming.get-color-from-palette($palette, default-contrast);
-  $active-background-color: theming.get-color-from-palette($palette, 0.3);
+@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-disabled-color: null;
 
   @if (meta.type-of($palette-color) == color) {
     $active-disabled-color: color.adjust($palette-color, $alpha: -$_selected-fade-amount);
   }
   @else {
-    $active-disabled-color: theming.get-color-from-palette($foreground, disabled-button);
+    $active-disabled-color: inspection.get-theme-color($theme, foreground, disabled-button);
   }
 
   @return (
@@ -158,17 +150,15 @@ $private-default-overlap-color: #a8dab5;
   );
 }
 
-@function private-get-toggle-color-palette-color-tokens($config, $palette-name) {
-  $palette: map.get($config, $palette-name);
-
+@function private-get-toggle-color-palette-color-tokens($theme, $palette-name) {
   @return (
-    toggle-active-state-icon-color: theming.get-color-from-palette($palette, text),
+    toggle-active-state-icon-color: inspection.get-theme-color($theme, $palette-name, text),
   );
 }
 
 
 // Tokens that can be configured through Angular Material's density theming API.
-@function get-density-tokens($config) {
+@function get-density-tokens($theme) {
   @return ();
 }
 
diff --git a/src/material/core/tokens/m2/mat/_stepper.scss b/src/material/core/tokens/m2/mat/_stepper.scss
index 4ec35f2eb566..8a2fe0f5fbbb 100644
--- a/src/material/core/tokens/m2/mat/_stepper.scss
+++ b/src/material/core/tokens/m2/mat/_stepper.scss
@@ -1,7 +1,7 @@
 @use 'sass:map';
 @use '../../token-utils';
 @use '../../../theming/theming';
-@use '../../../typography/typography-utils';
+@use '../../../theming/inspection';
 @use '../../../style/sass-utils';
 
 // The prefix used to generate the fully qualified name for tokens in this file.
@@ -14,62 +14,59 @@ $prefix: (mat, stepper);
 }
 
 // Tokens that can be configured through Angular Material's color theming API.
-@function get-color-tokens($config) {
-  $foreground: map.get($config, foreground);
-  $background: map.get($config, background);
-  $primary: map.get($config, primary);
-  $warn: map.get($config, warn);
-
-  @return map.merge(private-get-color-palette-color-tokens($primary), (
+@function get-color-tokens($theme) {
+  @return map.merge(private-get-color-palette-color-tokens($theme, primary), (
     // Background for stepper container.
-    container-color: theming.get-color-from-palette($background, card),
+    container-color: inspection.get-theme-color($theme, background, card),
     // Color of the line indicator connecting the steps.
-    line-color: theming.get-color-from-palette($foreground, divider),
+    line-color: inspection.get-theme-color($theme, foreground, divider),
     // Background color of the header while hovered.
-    header-hover-state-layer-color: theming.get-color-from-palette($background, hover),
+    header-hover-state-layer-color: inspection.get-theme-color($theme, background, hover),
     // Background color of the header while focused.
-    header-focus-state-layer-color: theming.get-color-from-palette($background, hover),
+    header-focus-state-layer-color: inspection.get-theme-color($theme, background, hover),
     // Color of the text inside the step header.
-    header-label-text-color: theming.get-color-from-palette($foreground, secondary-text),
+    header-label-text-color: inspection.get-theme-color($theme, foreground, secondary-text),
     // Color for the "optional" label in the step header.
-    header-optional-label-text-color: theming.get-color-from-palette($foreground, secondary-text),
+    header-optional-label-text-color: inspection.get-theme-color(
+        $theme, foreground, secondary-text),
     // Color of the header text when a step is selected.
-    header-selected-state-label-text-color: theming.get-color-from-palette($foreground, text),
+    header-selected-state-label-text-color: inspection.get-theme-color($theme, foreground, text),
     // Color of the header text when a step is in an error state.
-    header-error-state-label-text-color: theming.get-color-from-palette($warn, text),
+    header-error-state-label-text-color: inspection.get-theme-color($theme, warn, text),
     // Background color of the header icon.
-    header-icon-background-color: theming.get-color-from-palette($foreground, secondary-text),
+    header-icon-background-color: inspection.get-theme-color($theme, foreground, secondary-text),
     // Foreground color of the header icon in the error state.
-    header-error-state-icon-foreground-color: theming.get-color-from-palette($warn, text),
+    header-error-state-icon-foreground-color: inspection.get-theme-color($theme, warn, text),
     // Background color of the header icon in the error state.
     header-error-state-icon-background-color: transparent,
   ));
 }
 
 // Tokens that can be configured through Angular Material's typography theming API.
-@function get-typography-tokens($config) {
+@function get-typography-tokens($theme) {
   @return (
     // Font family of the entire stepper.
-    container-text-font: typography-utils.font-family($config),
+    container-text-font: inspection.get-theme-typography($theme, body-2, font-family),
     // Font family of the text inside the step header.
-    header-label-text-font: typography-utils.font-family($config, body-1) or
-      typography-utils.font-family($config),
+    header-label-text-font: inspection.get-theme-typography($theme, body-2, font-family),
     // Size of the text inside the step header.
-    header-label-text-size: typography-utils.font-size($config, body-1),
+    header-label-text-size: inspection.get-theme-typography($theme, body-2, font-size),
     // Weight of the text inside the step header.
-    header-label-text-weight: typography-utils.font-weight($config, body-1),
+    header-label-text-weight: inspection.get-theme-typography($theme, body-2, font-weight),
     // Color of the header text when a step is in an error state.
-    header-error-state-label-text-size: typography-utils.font-size($config, body-2),
+    header-error-state-label-text-size: inspection.get-theme-typography($theme, body-1, font-size),
     // Size of the header text in the selected state.
-    header-selected-state-label-text-size: typography-utils.font-size($config, body-2),
+    header-selected-state-label-text-size: inspection.get-theme-typography(
+        $theme, body-1, font-size),
     // Weight of the header text in the selected state.
-    header-selected-state-label-text-weight: typography-utils.font-weight($config, body-2),
+    header-selected-state-label-text-weight: inspection.get-theme-typography(
+        $theme, body-1, font-weight),
   );
 }
 
 // Tokens that can be configured through Angular Material's density theming API.
-@function get-density-tokens($config) {
-  $scale: theming.clamp-density($config, -4);
+@function get-density-tokens($theme) {
+  $scale: theming.clamp-density(inspection.get-theme-density($theme), -4);
   $height-config: (
     0: 72px,
     -1: 68px,
@@ -84,13 +81,13 @@ $prefix: (mat, stepper);
 }
 
 // Generates the tokens used to theme the stepper based on a palette.
-@function private-get-color-palette-color-tokens($palette) {
-  $active-state-foreground: theming.get-color-from-palette($palette, default-contrast);
-  $active-state-background: theming.get-color-from-palette($palette);
+@function private-get-color-palette-color-tokens($theme, $palette-name) {
+  $active-state-foreground: inspection.get-theme-color($theme, $palette-name, default-contrast);
+  $active-state-background: inspection.get-theme-color($theme, $palette-name);
 
   @return (
     // Foreground color of the header icon.
-    header-icon-foreground-color: theming.get-color-from-palette($palette, default-contrast),
+    header-icon-foreground-color: $active-state-foreground,
     // Background color of the header icon in the selected state.
     header-selected-state-icon-background-color: $active-state-background,
     // Foreground color of the header icon in the selected state.
diff --git a/src/material/core/typography/_all-typography.scss b/src/material/core/typography/_all-typography.scss
index 8df96ef5bcfd..29a0db750ffe 100644
--- a/src/material/core/typography/_all-typography.scss
+++ b/src/material/core/typography/_all-typography.scss
@@ -35,17 +35,14 @@
 @use '../../snack-bar/snack-bar-theme';
 @use '../../form-field/form-field-theme';
 @use '../../tree/tree-theme';
-@use '../theming/theming';
+@use '../theming/inspection';
 @use '../core-theme';
 
 // Includes all of the typographic styles.
-@mixin all-component-typographies($config-or-theme: null) {
-  $config: if(theming.private-is-theme-object($config-or-theme),
-      theming.get-typography-config($config-or-theme), $config-or-theme);
-
+@mixin all-component-typographies($theme: null) {
   // If no actual color configuration has been specified, create a default one.
-  @if not $config {
-    $config: typography.define-typography-config();
+  @if not inspection.theme-has($theme, typography) {
+    $theme: typography.define-typography-config();
   }
 
   // TODO: COMP-309: Do not use individual mixins. Instead, use the all-theme mixin and only
@@ -53,47 +50,47 @@
   // not possible as it would introduce a circular dependency for typography because the `mat-core`
   // mixin that is transitively loaded by the `all-theme` file, imports `all-typography` which
   // would then load `all-theme` again. This ultimately results a circular dependency.
-  @include badge-theme.typography($config);
-  @include typography.typography-hierarchy($config);
-  @include bottom-sheet-theme.typography($config);
-  @include button-toggle-theme.typography($config);
-  @include divider-theme.typography($config);
-  @include datepicker-theme.typography($config);
-  @include expansion-theme.typography($config);
-  @include grid-list-theme.typography($config);
-  @include icon-theme.typography($config);
-  @include progress-spinner-theme.typography($config);
-  @include sidenav-theme.typography($config);
-  @include stepper-theme.typography($config);
-  @include sort-theme.typography($config);
-  @include toolbar-theme.typography($config);
-  @include tree-theme.typography($config);
-  @include core-theme.typography($config);
-  @include card-theme.typography($config);
-  @include progress-bar-theme.typography($config);
-  @include tooltip-theme.typography($config);
-  @include form-field-theme.typography($config);
-  @include input-theme.typography($config);
-  @include select-theme.typography($config);
-  @include autocomplete-theme.typography($config);
-  @include dialog-theme.typography($config);
-  @include chips-theme.typography($config);
-  @include slide-toggle-theme.typography($config);
-  @include radio-theme.typography($config);
-  @include slider-theme.typography($config);
-  @include menu-theme.typography($config);
-  @include list-theme.typography($config);
-  @include paginator-theme.typography($config);
-  @include tabs-theme.typography($config);
-  @include checkbox-theme.typography($config);
-  @include button-theme.typography($config);
-  @include icon-button-theme.typography($config);
-  @include fab-theme.typography($config);
-  @include snack-bar-theme.typography($config);
-  @include table-theme.typography($config);
+  @include badge-theme.typography($theme);
+  @include typography.typography-hierarchy($theme);
+  @include bottom-sheet-theme.typography($theme);
+  @include button-toggle-theme.typography($theme);
+  @include divider-theme.typography($theme);
+  @include datepicker-theme.typography($theme);
+  @include expansion-theme.typography($theme);
+  @include grid-list-theme.typography($theme);
+  @include icon-theme.typography($theme);
+  @include progress-spinner-theme.typography($theme);
+  @include sidenav-theme.typography($theme);
+  @include stepper-theme.typography($theme);
+  @include sort-theme.typography($theme);
+  @include toolbar-theme.typography($theme);
+  @include tree-theme.typography($theme);
+  @include core-theme.typography($theme);
+  @include card-theme.typography($theme);
+  @include progress-bar-theme.typography($theme);
+  @include tooltip-theme.typography($theme);
+  @include form-field-theme.typography($theme);
+  @include input-theme.typography($theme);
+  @include select-theme.typography($theme);
+  @include autocomplete-theme.typography($theme);
+  @include dialog-theme.typography($theme);
+  @include chips-theme.typography($theme);
+  @include slide-toggle-theme.typography($theme);
+  @include radio-theme.typography($theme);
+  @include slider-theme.typography($theme);
+  @include menu-theme.typography($theme);
+  @include list-theme.typography($theme);
+  @include paginator-theme.typography($theme);
+  @include tabs-theme.typography($theme);
+  @include checkbox-theme.typography($theme);
+  @include button-theme.typography($theme);
+  @include icon-button-theme.typography($theme);
+  @include fab-theme.typography($theme);
+  @include snack-bar-theme.typography($theme);
+  @include table-theme.typography($theme);
 }
 
 // @deprecated Use `all-component-typographies`.
-@mixin angular-material-typography($config-or-theme: null) {
-  @include all-component-typographies($config-or-theme);
+@mixin angular-material-typography($theme: null) {
+  @include all-component-typographies($theme);
 }
diff --git a/src/material/core/typography/_typography.scss b/src/material/core/typography/_typography.scss
index 37400026ffb5..a70bab381d03 100644
--- a/src/material/core/typography/_typography.scss
+++ b/src/material/core/typography/_typography.scss
@@ -1,5 +1,6 @@
 @use 'typography-utils';
 @use '../theming/theming';
+@use '../theming/inspection';
 @use './versioning';
 
 // Definition and versioning functions live in their own files to avoid circular dependencies, but
@@ -12,10 +13,7 @@
 /// @param {Map} $config-or-theme A typography config for an entire theme.
 /// @param {String} $selector Ancestor selector under which native elements, such as h1, will
 ///     be styled.
-@mixin typography-hierarchy($config-or-theme, $selector: '.mat-typography') {
-  $config: versioning.private-typography-to-2018-config(
-      theming.get-typography-config($config-or-theme));
-
+@mixin typography-hierarchy($theme, $selector: '.mat-typography') {
   // Note that it seems redundant to prefix the class rules with the `$selector`, however it's
   // necessary if we want to allow people to overwrite the tag selectors. This is due to
   // selectors like `#{$selector} h1` being more specific than ones like `.mat-title`.
@@ -24,7 +22,8 @@
   #{$selector} .mat-h1,
   #{$selector} .mat-headline-5,
   #{$selector} h1 {
-    @include typography-utils.typography-level($config, headline-5);
+    font: inspection.get-theme-typography($theme, headline-5, font);
+    letter-spacing: inspection.get-theme-typography($theme, headline-5, letter-spacing);
     margin: 0 0 16px;
   }
 
@@ -33,7 +32,8 @@
   #{$selector} .mat-h2,
   #{$selector} .mat-headline-6,
   #{$selector} h2 {
-    @include typography-utils.typography-level($config, headline-6);
+    font: inspection.get-theme-typography($theme, headline-6, font);
+    letter-spacing: inspection.get-theme-typography($theme, headline-6, letter-spacing);
     margin: 0 0 16px;
   }
 
@@ -42,7 +42,8 @@
   #{$selector} .mat-h3,
   #{$selector} .mat-subtitle-1,
   #{$selector} h3 {
-    @include typography-utils.typography-level($config, subtitle-1);
+    font: inspection.get-theme-typography($theme, subtitle-1, font);
+    letter-spacing: inspection.get-theme-typography($theme, subtitle-1, letter-spacing);
     margin: 0 0 16px;
   }
 
@@ -51,7 +52,8 @@
   #{$selector} .mat-h4,
   #{$selector} .mat-body-1,
   #{$selector} h4 {
-    @include typography-utils.typography-level($config, body-1);
+    font: inspection.get-theme-typography($theme, body-1, font);
+    letter-spacing: inspection.get-theme-typography($theme, body-1, letter-spacing);
     margin: 0 0 16px;
   }
 
@@ -63,10 +65,10 @@
   #{$selector} h5 {
     @include typography-utils.font-shorthand(
        // calc is used here to support css variables
-      calc(#{typography-utils.font-size($config, body-2)} * 0.83),
-      typography-utils.font-weight($config, body-2),
-      typography-utils.line-height($config, body-2),
-      typography-utils.font-family($config, body-2)
+      calc(#{inspection.get-theme-typography($theme, body-2, font-size)} * 0.83),
+      inspection.get-theme-typography($theme, body-2, font-weight),
+      inspection.get-theme-typography($theme, body-2, line-height),
+      inspection.get-theme-typography($theme, body-2, font-family)
     );
 
     margin: 0 0 12px;
@@ -77,10 +79,10 @@
   #{$selector} h6 {
     @include typography-utils.font-shorthand(
        // calc is used here to support css variables
-      calc(#{typography-utils.font-size($config, body-2)} * 0.67),
-      typography-utils.font-weight($config, body-2),
-      typography-utils.line-height($config, body-2),
-      typography-utils.font-family($config, body-2)
+      calc(#{inspection.get-theme-typography($theme, body-2, font-size)} * 0.67),
+      inspection.get-theme-typography($theme, body-2, font-weight),
+      inspection.get-theme-typography($theme, body-2, line-height),
+      inspection.get-theme-typography($theme, body-2, font-family)
     );
 
     margin: 0 0 12px;
@@ -90,7 +92,8 @@
   .mat-subtitle-2,
   #{$selector} .mat-body-strong,
   #{$selector} .mat-subtitle-2 {
-    @include typography-utils.typography-level($config, subtitle-2);
+    font: inspection.get-theme-typography($theme, subtitle-2, font);
+    letter-spacing: inspection.get-theme-typography($theme, subtitle-2, letter-spacing);
   }
 
   .mat-body,
@@ -98,7 +101,8 @@
   #{$selector} .mat-body,
   #{$selector} .mat-body-2,
   #{$selector} {
-    @include typography-utils.typography-level($config, body-2);
+    font: inspection.get-theme-typography($theme, body-2, font);
+    letter-spacing: inspection.get-theme-typography($theme, body-2, letter-spacing);
 
     p {
       margin: 0 0 12px;
@@ -109,30 +113,35 @@
   .mat-caption,
   #{$selector} .mat-small,
   #{$selector} .mat-caption {
-    @include typography-utils.typography-level($config, caption);
+    font: inspection.get-theme-typography($theme, caption, font);
+    letter-spacing: inspection.get-theme-typography($theme, caption, letter-spacing);
   }
 
   .mat-headline-1,
   #{$selector} .mat-headline-1 {
-    @include typography-utils.typography-level($config, headline-1);
+    font: inspection.get-theme-typography($theme, headline-1, font);
+    letter-spacing: inspection.get-theme-typography($theme, headline-1, letter-spacing);
     margin: 0 0 56px;
   }
 
   .mat-headline-2,
   #{$selector} .mat-headline-2 {
-    @include typography-utils.typography-level($config, headline-2);
+    font: inspection.get-theme-typography($theme, headline-2, font);
+    letter-spacing: inspection.get-theme-typography($theme, headline-2, letter-spacing);
     margin: 0 0 64px;
   }
 
   .mat-headline-3,
   #{$selector} .mat-headline-3 {
-    @include typography-utils.typography-level($config, headline-3);
+    font: inspection.get-theme-typography($theme, headline-3, font);
+    letter-spacing: inspection.get-theme-typography($theme, headline-3, letter-spacing);
     margin: 0 0 64px;
   }
 
   .mat-headline-4,
   #{$selector} .mat-headline-4 {
-    @include typography-utils.typography-level($config, headline-4);
+    font: inspection.get-theme-typography($theme, headline-4, font);
+    letter-spacing: inspection.get-theme-typography($theme, headline-4, letter-spacing);
     margin: 0 0 64px;
   }
 }
@@ -155,7 +164,8 @@
   #{$selector} .mat-h1,
   #{$selector} .mat-headline,
   #{$selector} h1 {
-    @include typography-utils.typography-level($config, headline);
+    font: inspection.get-theme-typography($theme, headline, font);
+    letter-spacing: inspection.get-theme-typography($theme, headline, letter-spacing);
     margin: 0 0 16px;
   }
 
@@ -164,7 +174,8 @@
   #{$selector} .mat-h2,
   #{$selector} .mat-title,
   #{$selector} h2 {
-    @include typography-utils.typography-level($config, title);
+    font: inspection.get-theme-typography($theme, title, font);
+    letter-spacing: inspection.get-theme-typography($theme, title, letter-spacing);
     margin: 0 0 16px;
   }
 
@@ -173,7 +184,8 @@
   #{$selector} .mat-h3,
   #{$selector} .mat-subheading-2,
   #{$selector} h3 {
-    @include typography-utils.typography-level($config, subheading-2);
+    font: inspection.get-theme-typography($theme, subheading-2, font);
+    letter-spacing: inspection.get-theme-typography($theme, subheading-2, letter-spacing);
     margin: 0 0 16px;
   }
 
@@ -182,7 +194,8 @@
   #{$selector} .mat-h4,
   #{$selector} .mat-subheading-1,
   #{$selector} h4 {
-    @include typography-utils.typography-level($config, subheading-1);
+    font: inspection.get-theme-typography($theme, subheading-1, font);
+    letter-spacing: inspection.get-theme-typography($theme, subheading-1, letter-spacing);
     margin: 0 0 16px;
   }
 
@@ -194,10 +207,10 @@
   #{$selector} h5 {
     @include typography-utils.font-shorthand(
        // calc is used here to support css variables
-      calc(#{typography-utils.font-size($config, body-1)} * 0.83),
-      typography-utils.font-weight($config, body-1),
-      typography-utils.line-height($config, body-1),
-      typography-utils.font-family($config, body-1)
+      calc(#{inspection.get-theme-typography($theme, body-1, font-size)} * 0.83),
+      inspection.get-theme-typography($theme, body-1, font-weight),
+      inspection.get-theme-typography($theme, body-1, line-height),
+      inspection.get-theme-typography($theme, body-1, font-family)
     );
 
     margin: 0 0 12px;
@@ -208,10 +221,10 @@
   #{$selector} h6 {
     @include typography-utils.font-shorthand(
        // calc is used here to support css variables
-      calc(#{typography-utils.font-size($config, body-1)} * 0.67),
-      typography-utils.font-weight($config, body-1),
-      typography-utils.line-height($config, body-1),
-      typography-utils.font-family($config, body-1)
+      calc(#{inspection.get-theme-typography($theme, body-1, font-size)} * 0.67),
+      inspection.get-theme-typography($theme, body-1, font-weight),
+      inspection.get-theme-typography($theme, body-1, line-height),
+      inspection.get-theme-typography($theme, body-1, font-family)
     );
 
     margin: 0 0 12px;
@@ -221,7 +234,8 @@
   .mat-body-2,
   #{$selector} .mat-body-strong,
   #{$selector} .mat-body-2 {
-    @include typography-utils.typography-level($config, body-2);
+    font: inspection.get-theme-typography($theme, body-2, font);
+    letter-spacing: inspection.get-theme-typography($theme, body-2, letter-spacing);
   }
 
   .mat-body,
@@ -229,7 +243,8 @@
   #{$selector} .mat-body,
   #{$selector} .mat-body-1,
   #{$selector} {
-    @include typography-utils.typography-level($config, body-1);
+    font: inspection.get-theme-typography($theme, body-1, font);
+    letter-spacing: inspection.get-theme-typography($theme, body-1, letter-spacing);
 
     p {
       margin: 0 0 12px;
@@ -240,30 +255,35 @@
   .mat-caption,
   #{$selector} .mat-small,
   #{$selector} .mat-caption {
-    @include typography-utils.typography-level($config, caption);
+    font: inspection.get-theme-typography($theme, caption, font);
+    letter-spacing: inspection.get-theme-typography($theme, caption, letter-spacing);
   }
 
   .mat-display-4,
   #{$selector} .mat-display-4 {
-    @include typography-utils.typography-level($config, display-4);
+    font: inspection.get-theme-typography($theme, display-4, font);
+    letter-spacing: inspection.get-theme-typography($theme, display-4, letter-spacing);
     margin: 0 0 56px;
   }
 
   .mat-display-3,
   #{$selector} .mat-display-3 {
-    @include typography-utils.typography-level($config, display-3);
+    font: inspection.get-theme-typography($theme, display-3, font);
+    letter-spacing: inspection.get-theme-typography($theme, display-3, letter-spacing);
     margin: 0 0 64px;
   }
 
   .mat-display-2,
   #{$selector} .mat-display-2 {
-    @include typography-utils.typography-level($config, display-2);
+    font: inspection.get-theme-typography($theme, display-2, font);
+    letter-spacing: inspection.get-theme-typography($theme, display-2, letter-spacing);
     margin: 0 0 64px;
   }
 
   .mat-display-1,
   #{$selector} .mat-display-1 {
-    @include typography-utils.typography-level($config, display-1);
+    font: inspection.get-theme-typography($theme, display-1, font);
+    letter-spacing: inspection.get-theme-typography($theme, display-1, letter-spacing);
     margin: 0 0 64px;
   }
 }
diff --git a/src/material/datepicker/_datepicker-theme.scss b/src/material/datepicker/_datepicker-theme.scss
index 2ba231f1b8d5..48db28e3ae0a 100644
--- a/src/material/datepicker/_datepicker-theme.scss
+++ b/src/material/datepicker/_datepicker-theme.scss
@@ -2,6 +2,7 @@
 @use 'sass:map';
 @use '../core/tokens/m2/mat/datepicker' as tokens-mat-datepicker;
 @use '../core/theming/theming';
+@use '../core/theming/inspection';
 @use '../core/tokens/token-utils';
 @use '../core/style/sass-utils';
 @use '../core/typography/typography';
@@ -15,60 +16,52 @@ $today-fade-amount: 0.2;
 $calendar-body-font-size: 13px !default;
 $calendar-weekday-table-font-size: 11px !default;
 
-@mixin _calendar-color($config, $palette) {
-  $palette-color: theming.get-color-from-palette(map.get($config, $palette));
+@mixin _calendar-color($theme, $palette-name) {
+  $palette-color: inspection.get-theme-color($theme, $palette-name);
   $range-color: tokens-mat-datepicker.private-get-range-background-color($palette-color);
   $range-tokens: tokens-mat-datepicker.get-range-color-tokens($range-color);
   $calendar-tokens:
-    tokens-mat-datepicker.private-get-calendar-color-palette-color-tokens($config, $palette);
+    tokens-mat-datepicker.private-get-calendar-color-palette-color-tokens($theme, $palette-name);
 
   @include token-utils.create-token-values(tokens-mat-datepicker.$prefix,
     map.merge($calendar-tokens, $range-tokens));
 }
 
-@mixin color($config-or-theme) {
-  $config: theming.get-color-config($config-or-theme);
-  $foreground: map.get($config, foreground);
-  $background: map.get($config, background);
-  $disabled-color: theming.get-color-from-palette($foreground, disabled-text);
-
+@mixin color($theme) {
   @include sass-utils.current-selector-or-root() {
     @include token-utils.create-token-values(tokens-mat-datepicker.$prefix,
-      tokens-mat-datepicker.get-color-tokens($config));
+      tokens-mat-datepicker.get-color-tokens($theme));
   }
 
   .mat-datepicker-content {
     &.mat-accent {
-      @include _calendar-color($config, accent);
+      @include _calendar-color($theme, accent);
     }
 
     &.mat-warn {
-      @include _calendar-color($config, warn);
+      @include _calendar-color($theme, warn);
     }
   }
 
   .mat-datepicker-toggle-active {
     &.mat-accent {
       $accent-tokens:
-        tokens-mat-datepicker.private-get-toggle-color-palette-color-tokens($config, accent);
+        tokens-mat-datepicker.private-get-toggle-color-palette-color-tokens($theme, accent);
       @include token-utils.create-token-values(tokens-mat-datepicker.$prefix, $accent-tokens);
     }
 
     &.mat-warn {
       $warn-tokens:
-        tokens-mat-datepicker.private-get-toggle-color-palette-color-tokens($config, warn);
+        tokens-mat-datepicker.private-get-toggle-color-palette-color-tokens($theme, warn);
       @include token-utils.create-token-values(tokens-mat-datepicker.$prefix, $warn-tokens);
     }
   }
 }
 
-@mixin typography($config-or-theme) {
-  $config: typography.private-typography-to-2014-config(
-      theming.get-typography-config($config-or-theme));
-
+@mixin typography($theme) {
   @include sass-utils.current-selector-or-root() {
     @include token-utils.create-token-values(tokens-mat-datepicker.$prefix,
-      tokens-mat-datepicker.get-typography-tokens($config));
+      tokens-mat-datepicker.get-typography-tokens($theme));
   }
 }
 
@@ -90,9 +83,7 @@ $calendar-weekday-table-font-size: 11px !default;
   }
 }
 
-@mixin density($config-or-theme) {
-  $density-scale: theming.get-density-config($config-or-theme);
-
+@mixin density($theme) {
   // TODO(crisbeto): move this into the structural styles
   // once the icon button density is switched to tokens.
 
@@ -103,21 +94,16 @@ $calendar-weekday-table-font-size: 11px !default;
   }
 }
 
-@mixin theme($theme-or-color-config) {
-  $theme: theming.private-legacy-get-theme($theme-or-color-config);
+@mixin theme($theme) {
   @include theming.private-check-duplicate-theme-styles($theme, 'mat-datepicker') {
-    $color: theming.get-color-config($theme);
-    $density: theming.get-density-config($theme);
-    $typography: theming.get-typography-config($theme);
-
-    @if $color != null {
-      @include color($color);
+    @if inspection.theme-has($theme, color) {
+      @include color($theme);
     }
-    @if $density != null {
-      @include density($density);
+    @if inspection.theme-has($theme, density) {
+      @include density($theme);
     }
-    @if $typography != null {
-      @include typography($typography);
+    @if inspection.theme-has($theme, typography) {
+      @include typography($theme);
     }
   }
 }
diff --git a/src/material/sort/_sort-theme.scss b/src/material/sort/_sort-theme.scss
index 2bfb50249d1b..8ae16affc0ad 100644
--- a/src/material/sort/_sort-theme.scss
+++ b/src/material/sort/_sort-theme.scss
@@ -1,16 +1,12 @@
 @use 'sass:color';
-@use 'sass:map';
 @use 'sass:meta';
 @use '../core/theming/theming';
+@use '../core/theming/inspection';
 
-@mixin color($config-or-theme) {
-  $config: theming.get-color-config($config-or-theme);
-  $background: map.get($config, background);
-  $foreground: map.get($config, foreground);
-
+@mixin color($theme) {
   .mat-sort-header-arrow {
-    $table-background: theming.get-color-from-palette($background, 'card');
-    $text-color: theming.get-color-from-palette($foreground, secondary-text);
+    $table-background: inspection.get-theme-color($theme, background, card);
+    $text-color: inspection.get-theme-color($theme, foreground, secondary-text);
 
     // Because the arrow is made up of multiple elements that are stacked on top of each other,
     // we can't use the semi-transparent color from the theme directly. If the value is a color
@@ -28,25 +24,20 @@
   }
 }
 
-@mixin typography($config-or-theme) {}
+@mixin typography($theme) {}
 
-@mixin density($config-or-theme) {}
+@mixin density($theme) {}
 
-@mixin theme($theme-or-color-config) {
-  $theme: theming.private-legacy-get-theme($theme-or-color-config);
+@mixin theme($theme) {
   @include theming.private-check-duplicate-theme-styles($theme, 'mat-sort') {
-    $color: theming.get-color-config($theme);
-    $density: theming.get-density-config($theme);
-    $typography: theming.get-typography-config($theme);
-
-    @if $color != null {
-      @include color($color);
+    @if inspection.theme-has($theme, color) {
+      @include color($theme);
     }
-    @if $density != null {
-      @include density($density);
+    @if inspection.theme-has($theme, density) {
+      @include density($theme);
     }
-    @if $typography != null {
-      @include typography($typography);
+    @if inspection.theme-has($theme, typography) {
+      @include typography($theme);
     }
   }
 }
diff --git a/src/material/stepper/_stepper-theme.scss b/src/material/stepper/_stepper-theme.scss
index 6e490c5d469c..c2fe9412a05f 100644
--- a/src/material/stepper/_stepper-theme.scss
+++ b/src/material/stepper/_stepper-theme.scss
@@ -1,69 +1,51 @@
-@use 'sass:map';
-@use 'sass:math';
 @use '../core/theming/theming';
+@use '../core/theming/inspection';
 @use '../core/typography/typography';
-@use '../core/density/private/compatibility';
 @use '../core/style/sass-utils';
 @use '../core/tokens/token-utils';
 @use '../core/tokens/m2/mat/stepper' as tokens-mat-stepper;
-@use './stepper-variables';
-
-@mixin color($config-or-theme) {
-  $config: theming.get-color-config($config-or-theme);
 
+@mixin color($theme) {
   @include sass-utils.current-selector-or-root() {
     @include token-utils.create-token-values(tokens-mat-stepper.$prefix,
-      tokens-mat-stepper.get-color-tokens($config));
+      tokens-mat-stepper.get-color-tokens($theme));
 
     .mat-step-header.mat-accent {
       @include token-utils.create-token-values(tokens-mat-stepper.$prefix,
-        tokens-mat-stepper.private-get-color-palette-color-tokens(map.get($config, accent)));
+        tokens-mat-stepper.private-get-color-palette-color-tokens($theme, accent));
     }
 
     .mat-step-header.mat-warn {
       @include token-utils.create-token-values(tokens-mat-stepper.$prefix,
-        tokens-mat-stepper.private-get-color-palette-color-tokens(map.get($config, warn)));
+        tokens-mat-stepper.private-get-color-palette-color-tokens($theme, warn));
     }
   }
 }
 
-@mixin typography($config-or-theme) {
-  $config: typography.private-typography-to-2014-config(
-      theming.get-typography-config($config-or-theme));
-
+@mixin typography($theme) {
   @include sass-utils.current-selector-or-root() {
     @include token-utils.create-token-values(tokens-mat-stepper.$prefix,
-      tokens-mat-stepper.get-typography-tokens($config));
+      tokens-mat-stepper.get-typography-tokens($theme));
   }
 }
 
-@mixin density($config-or-theme) {
-  $density-scale: theming.get-density-config($config-or-theme);
-  $height: compatibility.private-density-prop-value(stepper-variables.$density-config,
-    $density-scale, height);
-  $vertical-padding: math.div($height - stepper-variables.$label-header-height, 2);
-
+@mixin density($theme) {
   @include sass-utils.current-selector-or-root() {
     @include token-utils.create-token-values(tokens-mat-stepper.$prefix,
-      tokens-mat-stepper.get-density-tokens($density-scale));
+      tokens-mat-stepper.get-density-tokens($theme));
   }
 }
 
-@mixin theme($theme-or-color-config) {
-  $theme: theming.private-legacy-get-theme($theme-or-color-config);
+@mixin theme($theme) {
   @include theming.private-check-duplicate-theme-styles($theme, 'mat-stepper') {
-    $color: theming.get-color-config($theme);
-    $density: theming.get-density-config($theme);
-    $typography: theming.get-typography-config($theme);
-
-    @if $color != null {
-      @include color($color);
+    @if inspection.theme-has($theme, color) {
+      @include color($theme);
     }
-    @if $density != null {
-      @include density($density);
+    @if inspection.theme-has($theme, density) {
+      @include density($theme);
     }
-    @if $typography != null {
-      @include typography($typography);
+    @if inspection.theme-has($theme, typography) {
+      @include typography($theme);
     }
   }
 }
diff --git a/src/material/tree/_tree-theme.scss b/src/material/tree/_tree-theme.scss
index 871c27b85386..a54cda5fe82f 100644
--- a/src/material/tree/_tree-theme.scss
+++ b/src/material/tree/_tree-theme.scss
@@ -1,41 +1,34 @@
-@use 'sass:map';
 @use '../core/density/private/compatibility';
 @use '../core/theming/theming';
+@use '../core/theming/inspection';
 @use '../core/typography/typography';
-@use '../core/typography/typography-utils';
 @use './tree-variables';
 
-@mixin color($config-or-theme) {
-  $config: theming.get-color-config($config-or-theme);
-  $background: map.get($config, background);
-  $foreground: map.get($config, foreground);
-
+@mixin color($theme) {
   .mat-tree {
-    background: theming.get-color-from-palette($background, 'card');
+    background: inspection.get-theme-color($theme, background, card);
   }
 
   .mat-tree-node,
   .mat-nested-tree-node {
-    color: theming.get-color-from-palette($foreground, text);
+    color: inspection.get-theme-color($theme, foreground, text);
   }
 }
 
-@mixin typography($config-or-theme) {
-  $config: typography.private-typography-to-2014-config(
-      theming.get-typography-config($config-or-theme));
+@mixin typography($theme) {
   .mat-tree {
-    font-family: typography-utils.font-family($config);
+    font-family: inspection.get-theme-typography($theme, body-2, font-family);
   }
 
   .mat-tree-node,
   .mat-nested-tree-node {
-    font-weight: typography-utils.font-weight($config, body-1);
-    font-size: typography-utils.font-size($config, body-1);
+    font-weight: inspection.get-theme-typography($theme, body-2, font-weight);
+    font-size: inspection.get-theme-typography($theme, body-2, font-size);
   }
 }
 
-@mixin density($config-or-theme) {
-  $density-scale: theming.get-density-config($config-or-theme);
+@mixin density($theme) {
+  $density-scale: inspection.get-theme-density($theme);
   $height: compatibility.private-density-prop-value(tree-variables.$density-config,
     $density-scale, height);
 
@@ -46,21 +39,16 @@
   }
 }
 
-@mixin theme($theme-or-color-config) {
-  $theme: theming.private-legacy-get-theme($theme-or-color-config);
+@mixin theme($theme) {
   @include theming.private-check-duplicate-theme-styles($theme, 'mat-tree') {
-    $color: theming.get-color-config($theme);
-    $density: theming.get-density-config($theme);
-    $typography: theming.get-typography-config($theme);
-
-    @if $color != null {
-      @include color($color);
+    @if inspection.theme-has($theme, color) {
+      @include color($theme);
     }
-    @if $density != null {
-      @include density($density);
+    @if inspection.theme-has($theme, density) {
+      @include density($theme);
     }
-    @if $typography != null {
-      @include typography($typography);
+    @if inspection.theme-has($theme, typography) {
+      @include typography($theme);
     }
   }
 }