diff --git a/src/material/core/m2/BUILD.bazel b/src/material/core/m2/BUILD.bazel
index 063941b0165d..881f735a7751 100644
--- a/src/material/core/m2/BUILD.bazel
+++ b/src/material/core/m2/BUILD.bazel
@@ -6,10 +6,32 @@ sass_library(
     name = "m2_sass",
     srcs = [
         "_index.scss",
+    ],
+    deps = [
+        ":palette",
+        ":theming",
+    ],
+)
+
+sass_library(
+    name = "theming",
+    srcs = [
+        "_theming.scss",
+        "_typography.scss",
+        "_typography-utils.scss",
+    ],
+    deps = [
+        "//src/material/core/theming",
+        "//src/material/core/tokens/m2",
+    ],
+)
+
+sass_library(
+    name = "palette",
+    srcs = [
         "_palette.scss",
         "_theming.scss",
         "_typography.scss",
         "_typography-utils.scss",
     ],
-    deps = ["//src/material/core/theming"],
 )
diff --git a/src/material/core/m2/_theming.scss b/src/material/core/m2/_theming.scss
index 75ec69198da6..9e44b8dac970 100644
--- a/src/material/core/m2/_theming.scss
+++ b/src/material/core/m2/_theming.scss
@@ -3,6 +3,7 @@
 @use 'sass:meta';
 @use 'sass:color';
 @use '../theming/theming';
+@use '../tokens/m2';
 @use './palette';
 
 /// Extracts a color from a palette or throws an error if it doesn't exist.
@@ -114,44 +115,19 @@
 }
 
 @function _define-system($primary, $accent, $warn, $is-dark) {
-  $system: (
-    primary: map.get($primary, default),
-    on-primary: map.get($primary, default-contrast),
-    secondary: map.get($accent, default),
-    on-secondary: map.get($accent, default-contrast),
-    error: map.get($warn, default),
-    on-error: map.get($warn, default-contrast),
-    shadow: black,
-    hover-state-layer-opacity: 0.04,
-    focus-state-layer-opacity: 0.12,
-    pressed-state-layer-opacity: 0.12,
+  $palettes: (
+    primary: $primary,
+    accent: $accent,
+    warn: $warn,
   );
 
-  @if $is-dark {
-    @return map.merge($system, (
-      surface: map.get(palette.$grey-palette, 800),
-      surface-variant: #4a4a4a,
-      on-surface: white,
-      on-surface-variant: rgba(white, 0.7),
-      background: #303030,
-      inverse-surface: white,
-      inverse-on-surface: rgba(black, 0.87),
-      outline: rgba(white, 0.12),
-      outline-variant: rgba(white, 0.38),
-    ));
-  } @else {
-    @return map.merge($system, (
-      surface: white,
-      surface-variant: #f6f6f6,
-      on-surface: rgba(black, 0.87),
-      on-surface-variant: rgba(black, 0.54),
-      background: map.get(palette.$grey-palette, 50),
-      inverse-surface: map.get(palette.$grey-palette, 800),
-      inverse-on-surface: white,
-      outline: rgba(black, 0.12),
-      outline-variant: rgba(black, 0.38),
-    ));
-  }
+  $color: if(
+      $is-dark,
+      m2.md-sys-color-values-dark($palettes),
+      m2.md-sys-color-values-light($palettes));
+  $state: m2.md-sys-state-values();
+
+  @return map.merge($color, $state);
 }
 
 // Creates a color configuration from the specified
diff --git a/src/material/core/tokens/m2/BUILD.bazel b/src/material/core/tokens/m2/BUILD.bazel
new file mode 100644
index 000000000000..945d36b686e2
--- /dev/null
+++ b/src/material/core/tokens/m2/BUILD.bazel
@@ -0,0 +1,19 @@
+load("//tools:defaults.bzl", "sass_library")
+
+package(default_visibility = ["//visibility:public"])
+
+sass_library(
+    name = "m2",
+    srcs = [
+        "_index.scss",
+        "_md-sys-color.scss",
+        "_md-sys-elevation.scss",
+        "_md-sys-motion.scss",
+        "_md-sys-shape.scss",
+        "_md-sys-state.scss",
+        "_md-sys-typescale.scss",
+    ],
+    deps = [
+        "//src/material/core/m2:palette",
+    ],
+)
diff --git a/src/material/core/tokens/m2/_index.scss b/src/material/core/tokens/m2/_index.scss
new file mode 100644
index 000000000000..7cc298e39920
--- /dev/null
+++ b/src/material/core/tokens/m2/_index.scss
@@ -0,0 +1,6 @@
+@forward './md-sys-color';
+@forward './md-sys-elevation';
+@forward './md-sys-motion';
+@forward './md-sys-shape';
+@forward './md-sys-state';
+@forward './md-sys-typescale';
diff --git a/src/material/core/tokens/m2/_md-sys-color.scss b/src/material/core/tokens/m2/_md-sys-color.scss
new file mode 100644
index 000000000000..3696c8cad24a
--- /dev/null
+++ b/src/material/core/tokens/m2/_md-sys-color.scss
@@ -0,0 +1,119 @@
+//
+// Design system display name: Material 3
+// Design system version: v0.161
+//
+
+@use 'sass:map';
+@use '../../m2/palette';
+
+@function md-sys-color-values-dark($palettes) {
+  @return (
+    primary: map.get($palettes, primary, default),
+    on-primary: map.get($palettes, primary, default-contrast),
+    secondary: map.get($palettes, accent, default),
+    on-secondary: map.get($palettes, accent, default-contrast),
+    error: map.get($palettes, warn, default),
+    on-error: map.get($palettes, warn, default-contrast),
+    shadow: black,
+    surface: map.get(palette.$grey-palette, 800),
+    on-surface: white,
+    surface-variant: #4a4a4a,
+    on-surface-variant: rgba(white, 0.7),
+    background: #303030,
+    inverse-surface: white,
+    inverse-on-surface: rgba(black, 0.87),
+    outline: rgba(white, 0.12),
+    outline-variant: rgba(white, 0.38),
+
+    // TBD
+    error-container: null,
+    inverse-primary: null,
+    on-background: null,
+    on-error-container: null,
+    on-primary-container: null,
+    on-primary-fixed: null,
+    on-primary-fixed-variant: null,
+    on-secondary-container: null,
+    on-secondary-fixed: null,
+    on-secondary-fixed-variant: null,
+    on-tertiary: null,
+    on-tertiary-container: null,
+    on-tertiary-fixed: null,
+    on-tertiary-fixed-variant: null,
+    primary-container: null,
+    primary-fixed: null,
+    primary-fixed-dim: null,
+    scrim: null,
+    secondary-container: null,
+    secondary-fixed: null,
+    secondary-fixed-dim: null,
+    surface-bright: null,
+    surface-container: null,
+    surface-container-high: null,
+    surface-container-highest: null,
+    surface-container-low: null,
+    surface-container-lowest: null,
+    surface-dim: null,
+    surface-tint: null,
+    tertiary: null,
+    tertiary-container: null,
+    tertiary-fixed: null,
+    tertiary-fixed-dim: null,
+  );
+}
+
+@function md-sys-color-values-light($palettes) {
+  @return (
+    primary: map.get($palettes, primary, default),
+    on-primary: map.get($palettes, primary, default-contrast),
+    secondary: map.get($palettes, accent, default),
+    on-secondary: map.get($palettes, accent, default-contrast),
+    error: map.get($palettes, warn, default),
+    on-error: map.get($palettes, warn, default-contrast),
+    shadow: black,
+    surface: white,
+    on-surface: rgba(black, 0.87),
+    surface-variant: #f6f6f6,
+    on-surface-variant: rgba(black, 0.54),
+    background: map.get(palette.$grey-palette, 50),
+    inverse-surface: map.get(palette.$grey-palette, 800),
+    inverse-on-surface: white,
+    outline: rgba(black, 0.12),
+    outline-variant: rgba(black, 0.38),
+
+    // TBD
+    error-container: null,
+    inverse-primary: null,
+    on-background: null,
+    on-error-container: null,
+    on-primary-container: null,
+    on-primary-fixed: null,
+    on-primary-fixed-variant: null,
+    on-secondary-container: null,
+    on-secondary-fixed: null,
+    on-secondary-fixed-variant: null,
+    on-tertiary: null,
+    on-tertiary-container: null,
+    on-tertiary-fixed: null,
+    on-tertiary-fixed-variant: null,
+    primary-container: null,
+    primary-fixed: null,
+    primary-fixed-dim: null,
+    scrim: null,
+    secondary-container: null,
+    secondary-fixed: null,
+    secondary-fixed-dim: null,
+    surface-bright: null,
+    surface-container: null,
+    surface-container-high: null,
+    surface-container-highest: null,
+    surface-container-low: null,
+    surface-container-lowest: null,
+    surface-dim: null,
+    surface-tint: null,
+    tertiary: null,
+    tertiary-container: null,
+    tertiary-fixed: null,
+    tertiary-fixed-dim: null,
+  );
+}
diff --git a/src/material/core/tokens/m2/_md-sys-elevation.scss b/src/material/core/tokens/m2/_md-sys-elevation.scss
new file mode 100644
index 000000000000..338dae2ea8e7
--- /dev/null
+++ b/src/material/core/tokens/m2/_md-sys-elevation.scss
@@ -0,0 +1,16 @@
+//
+// Design system display name: Material 3
+// Design system version: v0.161
+//
+
+@function md-sys-elevation-values() {
+  @return (
+    // TBD
+    level0: null,
+    level1: null,
+    level2: null,
+    level3: null,
+    level4: null,
+    level5: null,
+  );
+}
diff --git a/src/material/core/tokens/m2/_md-sys-motion.scss b/src/material/core/tokens/m2/_md-sys-motion.scss
new file mode 100644
index 000000000000..233682c6c359
--- /dev/null
+++ b/src/material/core/tokens/m2/_md-sys-motion.scss
@@ -0,0 +1,36 @@
+//
+// Design system display name: Material 3
+// Design system version: v0.161
+//
+
+@function md-sys-motion-values() {
+  @return (
+    // TBD
+    duration-extra-long1: null,
+    duration-extra-long2: null,
+    duration-extra-long3: null,
+    duration-extra-long4: null,
+    duration-long1: null,
+    duration-long2: null,
+    duration-long3: null,
+    duration-long4: null,
+    duration-medium1: null,
+    duration-medium2: null,
+    duration-medium3: null,
+    duration-medium4: null,
+    duration-short1: null,
+    duration-short2: null,
+    duration-short3: null,
+    duration-short4: null,
+    easing-emphasized: null,
+    easing-emphasized-accelerate: null,
+    easing-emphasized-decelerate: null,
+    easing-legacy: null,
+    easing-legacy-accelerate: null,
+    easing-legacy-decelerate: null,
+    easing-linear: null,
+    easing-standard: null,
+    easing-standard-accelerate: null,
+    easing-standard-decelerate: null,
+  );
+}
diff --git a/src/material/core/tokens/m2/_md-sys-shape.scss b/src/material/core/tokens/m2/_md-sys-shape.scss
new file mode 100644
index 000000000000..17499bf4ee24
--- /dev/null
+++ b/src/material/core/tokens/m2/_md-sys-shape.scss
@@ -0,0 +1,22 @@
+//
+// Design system display name: Material 3
+// Design system version: v0.161
+//
+
+@function  md-sys-shape-values() {
+  @return (
+    // TBD
+    corner-extra-large: null,
+    corner-extra-large-top: null,
+    corner-extra-small: null,
+    corner-extra-small-top: null,
+    corner-full: null,
+    corner-large: null,
+    corner-large-end: null,
+    corner-large-start: null,
+    corner-large-top: null,
+    corner-medium: null,
+    corner-none: null,
+    corner-small: null,
+  );
+}
diff --git a/src/material/core/tokens/m2/_md-sys-state.scss b/src/material/core/tokens/m2/_md-sys-state.scss
new file mode 100644
index 000000000000..5733370c9470
--- /dev/null
+++ b/src/material/core/tokens/m2/_md-sys-state.scss
@@ -0,0 +1,15 @@
+//
+// Design system display name: Material 3
+// Design system version: v0.161
+//
+
+@function md-sys-state-values($exclude-hardcoded-values: false) {
+  @return (
+    focus-state-layer-opacity: 0.12,
+    hover-state-layer-opacity: 0.04,
+    pressed-state-layer-opacity: 0.12,
+
+    // TBD
+    dragged-state-layer-opacity: 0.16,
+  );
+}
diff --git a/src/material/core/tokens/m2/_md-sys-typescale.scss b/src/material/core/tokens/m2/_md-sys-typescale.scss
new file mode 100644
index 000000000000..e77093270447
--- /dev/null
+++ b/src/material/core/tokens/m2/_md-sys-typescale.scss
@@ -0,0 +1,101 @@
+//
+// Design system display name: Material 3
+// Design system version: v0.161
+//
+
+@function md-sys-typescale-values($typography) {
+  @return (
+    body-large: null,
+    body-large-font: null,
+    body-large-line-height: null,
+    body-large-size: null,
+    body-large-tracking: null,
+    body-large-weight: null,
+    body-medium: null,
+    body-medium-font: null,
+    body-medium-line-height: null,
+    body-medium-size: null,
+    body-medium-tracking: null,
+    body-medium-weight: null,
+    body-small: null,
+    body-small-font: null,
+    body-small-line-height: null,
+    body-small-size: null,
+    body-small-tracking: null,
+    body-small-weight: null,
+    display-large: null,
+    display-large-font: null,
+    display-large-line-height: null,
+    display-large-size: null,
+    display-large-tracking: null,
+    display-large-weight: null,
+    display-medium: null,
+    display-medium-font: null,
+    display-medium-line-height: null,
+    display-medium-size: null,
+    display-medium-tracking: null,
+    display-medium-weight: null,
+    display-small: null,
+    display-small-font: null,
+    display-small-line-height: null,
+    display-small-size: null,
+    display-small-tracking: null,
+    display-small-weight: null,
+    headline-large: null,
+    headline-large-font: null,
+    headline-large-line-height: null,
+    headline-large-size: null,
+    headline-large-tracking: null,
+    headline-large-weight: null,
+    headline-medium: null,
+    headline-medium-font: null,
+    headline-medium-line-height: null,
+    headline-medium-size: null,
+    headline-medium-tracking: null,
+    headline-medium-weight: null,
+    headline-small: null,
+    headline-small-font: null,
+    headline-small-line-height: null,
+    headline-small-size: null,
+    headline-small-tracking: null,
+    headline-small-weight: null,
+    label-large: null,
+    label-large-font: null,
+    label-large-line-height: null,
+    label-large-size: null,
+    label-large-tracking: null,
+    label-large-weight: null,
+    label-large-weight-prominent: null,
+    label-medium: null,
+    label-medium-font: null,
+    label-medium-line-height: null,
+    label-medium-size: null,
+    label-medium-tracking: null,
+    label-medium-weight: null,
+    label-medium-weight-prominent: null,
+    label-small: null,
+    label-small-font: null,
+    label-small-line-height: null,
+    label-small-size: null,
+    label-small-tracking: null,
+    label-small-weight: null,
+    title-large: null,
+    title-large-font: null,
+    title-large-line-height: null,
+    title-large-size: null,
+    title-large-tracking: null,
+    title-large-weight: null,
+    title-medium: null,
+    title-medium-font: null,
+    title-medium-line-height: null,
+    title-medium-size: null,
+    title-medium-tracking: null,
+    title-medium-weight: null,
+    title-small: null,
+    title-small-font: null,
+    title-small-line-height: null,
+    title-small-size: null,
+    title-small-tracking: null,
+    title-small-weight: null,
+  );
+}