diff --git a/src/__tests__/__snapshots__/design-tokens.test.ts.snap b/src/__tests__/__snapshots__/design-tokens.test.ts.snap
index 368041efce..e571d06ae2 100644
--- a/src/__tests__/__snapshots__/design-tokens.test.ts.snap
+++ b/src/__tests__/__snapshots__/design-tokens.test.ts.snap
@@ -1876,6 +1876,90 @@ Object {
           "$description": "The monospace font family that will be applied globally to the product interface.",
           "$value": "Monaco, Menlo, Consolas, 'Courier Prime', Courier, 'Courier New', monospace",
         },
+        "font-size-body-m": Object {
+          "$description": "The font size for default body text. For example, <p> tags in text content, or button text content.",
+          "$value": "14px",
+        },
+        "font-size-body-s": Object {
+          "$description": "The font size for small body text. For example, form field descriptions, or badge text.",
+          "$value": "12px",
+        },
+        "font-size-display-l": Object {
+          "$description": "The font size for large display text.",
+          "$value": "44px",
+        },
+        "font-size-heading-1": Object {
+          "$description": "The font size for h1s.",
+          "$value": "28px",
+        },
+        "font-size-heading-2": Object {
+          "$description": "The font size for h2s.",
+          "$value": "18px",
+        },
+        "font-size-heading-3": Object {
+          "$description": "The font size for h3s.",
+          "$value": "18px",
+        },
+        "font-size-heading-4": Object {
+          "$description": "The font size for h4s.",
+          "$value": "16px",
+        },
+        "font-size-heading-5": Object {
+          "$description": "The font size for h5s.",
+          "$value": "16px",
+        },
+        "font-weight-heading-1": Object {
+          "$description": "The font weight for h1s.",
+          "$value": "400",
+        },
+        "font-weight-heading-2": Object {
+          "$description": "The font weight for h2s.",
+          "$value": "700",
+        },
+        "font-weight-heading-3": Object {
+          "$description": "The font weight for h3s.",
+          "$value": "400",
+        },
+        "font-weight-heading-4": Object {
+          "$description": "The font weight for h4s.",
+          "$value": "700",
+        },
+        "font-weight-heading-5": Object {
+          "$description": "The font weight for h5s.",
+          "$value": "400",
+        },
+        "line-height-body-m": Object {
+          "$description": "The line height for default body text.",
+          "$value": "22px",
+        },
+        "line-height-body-s": Object {
+          "$description": "The line height for small body text.",
+          "$value": "16px",
+        },
+        "line-height-display-l": Object {
+          "$description": "The line height for large display text.",
+          "$value": "56px",
+        },
+        "line-height-heading-1": Object {
+          "$description": "The line height for h1s.",
+          "$value": "36px",
+        },
+        "line-height-heading-2": Object {
+          "$description": "The line height for h2s.",
+          "$value": "22px",
+        },
+        "line-height-heading-3": Object {
+          "$description": "The line height for h3s.",
+          "$value": "22px",
+        },
+        "line-height-heading-4": Object {
+          "$description": "The line height for h4s.",
+          "$value": "20px",
+        },
+        "line-height-heading-5": Object {
+          "$description": "The line height for h5s.",
+          "$value": "20px",
+        },
         "motion-duration-complex": Object {
           "$description": "The duration for drawing more attention or accommodating for more complexity.",
           "$value": Object {
@@ -3968,6 +4052,90 @@ Object {
           "$description": "The monospace font family that will be applied globally to the product interface.",
           "$value": "Monaco, Menlo, Consolas, 'Courier Prime', Courier, 'Courier New', monospace",
         },
+        "font-size-body-m": Object {
+          "$description": "The font size for default body text. For example, <p> tags in text content, or button text content.",
+          "$value": "14px",
+        },
+        "font-size-body-s": Object {
+          "$description": "The font size for small body text. For example, form field descriptions, or badge text.",
+          "$value": "12px",
+        },
+        "font-size-display-l": Object {
+          "$description": "The font size for large display text.",
+          "$value": "44px",
+        },
+        "font-size-heading-1": Object {
+          "$description": "The font size for h1s.",
+          "$value": "28px",
+        },
+        "font-size-heading-2": Object {
+          "$description": "The font size for h2s.",
+          "$value": "18px",
+        },
+        "font-size-heading-3": Object {
+          "$description": "The font size for h3s.",
+          "$value": "18px",
+        },
+        "font-size-heading-4": Object {
+          "$description": "The font size for h4s.",
+          "$value": "16px",
+        },
+        "font-size-heading-5": Object {
+          "$description": "The font size for h5s.",
+          "$value": "16px",
+        },
+        "font-weight-heading-1": Object {
+          "$description": "The font weight for h1s.",
+          "$value": "400",
+        },
+        "font-weight-heading-2": Object {
+          "$description": "The font weight for h2s.",
+          "$value": "700",
+        },
+        "font-weight-heading-3": Object {
+          "$description": "The font weight for h3s.",
+          "$value": "400",
+        },
+        "font-weight-heading-4": Object {
+          "$description": "The font weight for h4s.",
+          "$value": "700",
+        },
+        "font-weight-heading-5": Object {
+          "$description": "The font weight for h5s.",
+          "$value": "400",
+        },
+        "line-height-body-m": Object {
+          "$description": "The line height for default body text.",
+          "$value": "22px",
+        },
+        "line-height-body-s": Object {
+          "$description": "The line height for small body text.",
+          "$value": "16px",
+        },
+        "line-height-display-l": Object {
+          "$description": "The line height for large display text.",
+          "$value": "56px",
+        },
+        "line-height-heading-1": Object {
+          "$description": "The line height for h1s.",
+          "$value": "36px",
+        },
+        "line-height-heading-2": Object {
+          "$description": "The line height for h2s.",
+          "$value": "22px",
+        },
+        "line-height-heading-3": Object {
+          "$description": "The line height for h3s.",
+          "$value": "22px",
+        },
+        "line-height-heading-4": Object {
+          "$description": "The line height for h4s.",
+          "$value": "20px",
+        },
+        "line-height-heading-5": Object {
+          "$description": "The line height for h5s.",
+          "$value": "20px",
+        },
         "motion-duration-complex": Object {
           "$description": "The duration for drawing more attention or accommodating for more complexity.",
           "$value": Object {
@@ -6060,6 +6228,90 @@ Object {
           "$description": "The monospace font family that will be applied globally to the product interface.",
           "$value": "Monaco, Menlo, Consolas, 'Courier Prime', Courier, 'Courier New', monospace",
         },
+        "font-size-body-m": Object {
+          "$description": "The font size for default body text. For example, <p> tags in text content, or button text content.",
+          "$value": "14px",
+        },
+        "font-size-body-s": Object {
+          "$description": "The font size for small body text. For example, form field descriptions, or badge text.",
+          "$value": "12px",
+        },
+        "font-size-display-l": Object {
+          "$description": "The font size for large display text.",
+          "$value": "44px",
+        },
+        "font-size-heading-1": Object {
+          "$description": "The font size for h1s.",
+          "$value": "28px",
+        },
+        "font-size-heading-2": Object {
+          "$description": "The font size for h2s.",
+          "$value": "18px",
+        },
+        "font-size-heading-3": Object {
+          "$description": "The font size for h3s.",
+          "$value": "18px",
+        },
+        "font-size-heading-4": Object {
+          "$description": "The font size for h4s.",
+          "$value": "16px",
+        },
+        "font-size-heading-5": Object {
+          "$description": "The font size for h5s.",
+          "$value": "16px",
+        },
+        "font-weight-heading-1": Object {
+          "$description": "The font weight for h1s.",
+          "$value": "400",
+        },
+        "font-weight-heading-2": Object {
+          "$description": "The font weight for h2s.",
+          "$value": "700",
+        },
+        "font-weight-heading-3": Object {
+          "$description": "The font weight for h3s.",
+          "$value": "400",
+        },
+        "font-weight-heading-4": Object {
+          "$description": "The font weight for h4s.",
+          "$value": "700",
+        },
+        "font-weight-heading-5": Object {
+          "$description": "The font weight for h5s.",
+          "$value": "400",
+        },
+        "line-height-body-m": Object {
+          "$description": "The line height for default body text.",
+          "$value": "22px",
+        },
+        "line-height-body-s": Object {
+          "$description": "The line height for small body text.",
+          "$value": "16px",
+        },
+        "line-height-display-l": Object {
+          "$description": "The line height for large display text.",
+          "$value": "56px",
+        },
+        "line-height-heading-1": Object {
+          "$description": "The line height for h1s.",
+          "$value": "36px",
+        },
+        "line-height-heading-2": Object {
+          "$description": "The line height for h2s.",
+          "$value": "22px",
+        },
+        "line-height-heading-3": Object {
+          "$description": "The line height for h3s.",
+          "$value": "22px",
+        },
+        "line-height-heading-4": Object {
+          "$description": "The line height for h4s.",
+          "$value": "20px",
+        },
+        "line-height-heading-5": Object {
+          "$description": "The line height for h5s.",
+          "$value": "20px",
+        },
         "motion-duration-complex": Object {
           "$description": "The duration for drawing more attention or accommodating for more complexity.",
           "$value": Object {
@@ -8152,6 +8404,90 @@ Object {
           "$description": "The monospace font family that will be applied globally to the product interface.",
           "$value": "Monaco, Menlo, Consolas, 'Courier Prime', Courier, 'Courier New', monospace",
         },
+        "font-size-body-m": Object {
+          "$description": "The font size for default body text. For example, <p> tags in text content, or button text content.",
+          "$value": "14px",
+        },
+        "font-size-body-s": Object {
+          "$description": "The font size for small body text. For example, form field descriptions, or badge text.",
+          "$value": "12px",
+        },
+        "font-size-display-l": Object {
+          "$description": "The font size for large display text.",
+          "$value": "44px",
+        },
+        "font-size-heading-1": Object {
+          "$description": "The font size for h1s.",
+          "$value": "28px",
+        },
+        "font-size-heading-2": Object {
+          "$description": "The font size for h2s.",
+          "$value": "18px",
+        },
+        "font-size-heading-3": Object {
+          "$description": "The font size for h3s.",
+          "$value": "18px",
+        },
+        "font-size-heading-4": Object {
+          "$description": "The font size for h4s.",
+          "$value": "16px",
+        },
+        "font-size-heading-5": Object {
+          "$description": "The font size for h5s.",
+          "$value": "16px",
+        },
+        "font-weight-heading-1": Object {
+          "$description": "The font weight for h1s.",
+          "$value": "400",
+        },
+        "font-weight-heading-2": Object {
+          "$description": "The font weight for h2s.",
+          "$value": "700",
+        },
+        "font-weight-heading-3": Object {
+          "$description": "The font weight for h3s.",
+          "$value": "400",
+        },
+        "font-weight-heading-4": Object {
+          "$description": "The font weight for h4s.",
+          "$value": "700",
+        },
+        "font-weight-heading-5": Object {
+          "$description": "The font weight for h5s.",
+          "$value": "400",
+        },
+        "line-height-body-m": Object {
+          "$description": "The line height for default body text.",
+          "$value": "22px",
+        },
+        "line-height-body-s": Object {
+          "$description": "The line height for small body text.",
+          "$value": "16px",
+        },
+        "line-height-display-l": Object {
+          "$description": "The line height for large display text.",
+          "$value": "56px",
+        },
+        "line-height-heading-1": Object {
+          "$description": "The line height for h1s.",
+          "$value": "36px",
+        },
+        "line-height-heading-2": Object {
+          "$description": "The line height for h2s.",
+          "$value": "22px",
+        },
+        "line-height-heading-3": Object {
+          "$description": "The line height for h3s.",
+          "$value": "22px",
+        },
+        "line-height-heading-4": Object {
+          "$description": "The line height for h4s.",
+          "$value": "20px",
+        },
+        "line-height-heading-5": Object {
+          "$description": "The line height for h5s.",
+          "$value": "20px",
+        },
         "motion-duration-complex": Object {
           "$description": "The duration for drawing more attention or accommodating for more complexity.",
           "$value": Object {
@@ -10244,6 +10580,90 @@ Object {
           "$description": "The monospace font family that will be applied globally to the product interface.",
           "$value": "Monaco, Menlo, Consolas, 'Courier Prime', Courier, 'Courier New', monospace",
         },
+        "font-size-body-m": Object {
+          "$description": "The font size for default body text. For example, <p> tags in text content, or button text content.",
+          "$value": "14px",
+        },
+        "font-size-body-s": Object {
+          "$description": "The font size for small body text. For example, form field descriptions, or badge text.",
+          "$value": "12px",
+        },
+        "font-size-display-l": Object {
+          "$description": "The font size for large display text.",
+          "$value": "44px",
+        },
+        "font-size-heading-1": Object {
+          "$description": "The font size for h1s.",
+          "$value": "28px",
+        },
+        "font-size-heading-2": Object {
+          "$description": "The font size for h2s.",
+          "$value": "18px",
+        },
+        "font-size-heading-3": Object {
+          "$description": "The font size for h3s.",
+          "$value": "18px",
+        },
+        "font-size-heading-4": Object {
+          "$description": "The font size for h4s.",
+          "$value": "16px",
+        },
+        "font-size-heading-5": Object {
+          "$description": "The font size for h5s.",
+          "$value": "16px",
+        },
+        "font-weight-heading-1": Object {
+          "$description": "The font weight for h1s.",
+          "$value": "400",
+        },
+        "font-weight-heading-2": Object {
+          "$description": "The font weight for h2s.",
+          "$value": "700",
+        },
+        "font-weight-heading-3": Object {
+          "$description": "The font weight for h3s.",
+          "$value": "400",
+        },
+        "font-weight-heading-4": Object {
+          "$description": "The font weight for h4s.",
+          "$value": "700",
+        },
+        "font-weight-heading-5": Object {
+          "$description": "The font weight for h5s.",
+          "$value": "400",
+        },
+        "line-height-body-m": Object {
+          "$description": "The line height for default body text.",
+          "$value": "22px",
+        },
+        "line-height-body-s": Object {
+          "$description": "The line height for small body text.",
+          "$value": "16px",
+        },
+        "line-height-display-l": Object {
+          "$description": "The line height for large display text.",
+          "$value": "56px",
+        },
+        "line-height-heading-1": Object {
+          "$description": "The line height for h1s.",
+          "$value": "36px",
+        },
+        "line-height-heading-2": Object {
+          "$description": "The line height for h2s.",
+          "$value": "22px",
+        },
+        "line-height-heading-3": Object {
+          "$description": "The line height for h3s.",
+          "$value": "22px",
+        },
+        "line-height-heading-4": Object {
+          "$description": "The line height for h4s.",
+          "$value": "20px",
+        },
+        "line-height-heading-5": Object {
+          "$description": "The line height for h5s.",
+          "$value": "20px",
+        },
         "motion-duration-complex": Object {
           "$description": "The duration for drawing more attention or accommodating for more complexity.",
           "$value": Object {
@@ -12336,6 +12756,90 @@ Object {
       "$description": "The monospace font family that will be applied globally to the product interface.",
       "$value": "Monaco, Menlo, Consolas, 'Courier Prime', Courier, 'Courier New', monospace",
     },
+    "font-size-body-m": Object {
+      "$description": "The font size for default body text. For example, <p> tags in text content, or button text content.",
+      "$value": "14px",
+    },
+    "font-size-body-s": Object {
+      "$description": "The font size for small body text. For example, form field descriptions, or badge text.",
+      "$value": "12px",
+    },
+    "font-size-display-l": Object {
+      "$description": "The font size for large display text.",
+      "$value": "44px",
+    },
+    "font-size-heading-1": Object {
+      "$description": "The font size for h1s.",
+      "$value": "28px",
+    },
+    "font-size-heading-2": Object {
+      "$description": "The font size for h2s.",
+      "$value": "18px",
+    },
+    "font-size-heading-3": Object {
+      "$description": "The font size for h3s.",
+      "$value": "18px",
+    },
+    "font-size-heading-4": Object {
+      "$description": "The font size for h4s.",
+      "$value": "16px",
+    },
+    "font-size-heading-5": Object {
+      "$description": "The font size for h5s.",
+      "$value": "16px",
+    },
+    "font-weight-heading-1": Object {
+      "$description": "The font weight for h1s.",
+      "$value": "400",
+    },
+    "font-weight-heading-2": Object {
+      "$description": "The font weight for h2s.",
+      "$value": "700",
+    },
+    "font-weight-heading-3": Object {
+      "$description": "The font weight for h3s.",
+      "$value": "400",
+    },
+    "font-weight-heading-4": Object {
+      "$description": "The font weight for h4s.",
+      "$value": "700",
+    },
+    "font-weight-heading-5": Object {
+      "$description": "The font weight for h5s.",
+      "$value": "400",
+    },
+    "line-height-body-m": Object {
+      "$description": "The line height for default body text.",
+      "$value": "22px",
+    },
+    "line-height-body-s": Object {
+      "$description": "The line height for small body text.",
+      "$value": "16px",
+    },
+    "line-height-display-l": Object {
+      "$description": "The line height for large display text.",
+      "$value": "56px",
+    },
+    "line-height-heading-1": Object {
+      "$description": "The line height for h1s.",
+      "$value": "36px",
+    },
+    "line-height-heading-2": Object {
+      "$description": "The line height for h2s.",
+      "$value": "22px",
+    },
+    "line-height-heading-3": Object {
+      "$description": "The line height for h3s.",
+      "$value": "22px",
+    },
+    "line-height-heading-4": Object {
+      "$description": "The line height for h4s.",
+      "$value": "20px",
+    },
+    "line-height-heading-5": Object {
+      "$description": "The line height for h5s.",
+      "$value": "20px",
+    },
     "motion-duration-complex": Object {
       "$description": "The duration for drawing more attention or accommodating for more complexity.",
       "$value": Object {
@@ -14433,6 +14937,90 @@ Object {
           "$description": "The monospace font family that will be applied globally to the product interface.",
           "$value": "Monaco, Menlo, Consolas, 'Courier Prime', Courier, 'Courier New', monospace",
         },
+        "font-size-body-m": Object {
+          "$description": "The font size for default body text. For example, <p> tags in text content, or button text content.",
+          "$value": "14px",
+        },
+        "font-size-body-s": Object {
+          "$description": "The font size for small body text. For example, form field descriptions, or badge text.",
+          "$value": "12px",
+        },
+        "font-size-display-l": Object {
+          "$description": "The font size for large display text.",
+          "$value": "42px",
+        },
+        "font-size-heading-1": Object {
+          "$description": "The font size for h1s.",
+          "$value": "24px",
+        },
+        "font-size-heading-2": Object {
+          "$description": "The font size for h2s.",
+          "$value": "20px",
+        },
+        "font-size-heading-3": Object {
+          "$description": "The font size for h3s.",
+          "$value": "18px",
+        },
+        "font-size-heading-4": Object {
+          "$description": "The font size for h4s.",
+          "$value": "16px",
+        },
+        "font-size-heading-5": Object {
+          "$description": "The font size for h5s.",
+          "$value": "14px",
+        },
+        "font-weight-heading-1": Object {
+          "$description": "The font weight for h1s.",
+          "$value": "700",
+        },
+        "font-weight-heading-2": Object {
+          "$description": "The font weight for h2s.",
+          "$value": "700",
+        },
+        "font-weight-heading-3": Object {
+          "$description": "The font weight for h3s.",
+          "$value": "700",
+        },
+        "font-weight-heading-4": Object {
+          "$description": "The font weight for h4s.",
+          "$value": "700",
+        },
+        "font-weight-heading-5": Object {
+          "$description": "The font weight for h5s.",
+          "$value": "700",
+        },
+        "line-height-body-m": Object {
+          "$description": "The line height for default body text.",
+          "$value": "20px",
+        },
+        "line-height-body-s": Object {
+          "$description": "The line height for small body text.",
+          "$value": "16px",
+        },
+        "line-height-display-l": Object {
+          "$description": "The line height for large display text.",
+          "$value": "48px",
+        },
+        "line-height-heading-1": Object {
+          "$description": "The line height for h1s.",
+          "$value": "30px",
+        },
+        "line-height-heading-2": Object {
+          "$description": "The line height for h2s.",
+          "$value": "24px",
+        },
+        "line-height-heading-3": Object {
+          "$description": "The line height for h3s.",
+          "$value": "22px",
+        },
+        "line-height-heading-4": Object {
+          "$description": "The line height for h4s.",
+          "$value": "20px",
+        },
+        "line-height-heading-5": Object {
+          "$description": "The line height for h5s.",
+          "$value": "18px",
+        },
         "motion-duration-complex": Object {
           "$description": "The duration for drawing more attention or accommodating for more complexity.",
           "$value": Object {
@@ -16525,6 +17113,90 @@ Object {
           "$description": "The monospace font family that will be applied globally to the product interface.",
           "$value": "Monaco, Menlo, Consolas, 'Courier Prime', Courier, 'Courier New', monospace",
         },
+        "font-size-body-m": Object {
+          "$description": "The font size for default body text. For example, <p> tags in text content, or button text content.",
+          "$value": "14px",
+        },
+        "font-size-body-s": Object {
+          "$description": "The font size for small body text. For example, form field descriptions, or badge text.",
+          "$value": "12px",
+        },
+        "font-size-display-l": Object {
+          "$description": "The font size for large display text.",
+          "$value": "42px",
+        },
+        "font-size-heading-1": Object {
+          "$description": "The font size for h1s.",
+          "$value": "24px",
+        },
+        "font-size-heading-2": Object {
+          "$description": "The font size for h2s.",
+          "$value": "20px",
+        },
+        "font-size-heading-3": Object {
+          "$description": "The font size for h3s.",
+          "$value": "18px",
+        },
+        "font-size-heading-4": Object {
+          "$description": "The font size for h4s.",
+          "$value": "16px",
+        },
+        "font-size-heading-5": Object {
+          "$description": "The font size for h5s.",
+          "$value": "14px",
+        },
+        "font-weight-heading-1": Object {
+          "$description": "The font weight for h1s.",
+          "$value": "700",
+        },
+        "font-weight-heading-2": Object {
+          "$description": "The font weight for h2s.",
+          "$value": "700",
+        },
+        "font-weight-heading-3": Object {
+          "$description": "The font weight for h3s.",
+          "$value": "700",
+        },
+        "font-weight-heading-4": Object {
+          "$description": "The font weight for h4s.",
+          "$value": "700",
+        },
+        "font-weight-heading-5": Object {
+          "$description": "The font weight for h5s.",
+          "$value": "700",
+        },
+        "line-height-body-m": Object {
+          "$description": "The line height for default body text.",
+          "$value": "20px",
+        },
+        "line-height-body-s": Object {
+          "$description": "The line height for small body text.",
+          "$value": "16px",
+        },
+        "line-height-display-l": Object {
+          "$description": "The line height for large display text.",
+          "$value": "48px",
+        },
+        "line-height-heading-1": Object {
+          "$description": "The line height for h1s.",
+          "$value": "30px",
+        },
+        "line-height-heading-2": Object {
+          "$description": "The line height for h2s.",
+          "$value": "24px",
+        },
+        "line-height-heading-3": Object {
+          "$description": "The line height for h3s.",
+          "$value": "22px",
+        },
+        "line-height-heading-4": Object {
+          "$description": "The line height for h4s.",
+          "$value": "20px",
+        },
+        "line-height-heading-5": Object {
+          "$description": "The line height for h5s.",
+          "$value": "18px",
+        },
         "motion-duration-complex": Object {
           "$description": "The duration for drawing more attention or accommodating for more complexity.",
           "$value": Object {
@@ -18617,6 +19289,90 @@ Object {
           "$description": "The monospace font family that will be applied globally to the product interface.",
           "$value": "Monaco, Menlo, Consolas, 'Courier Prime', Courier, 'Courier New', monospace",
         },
+        "font-size-body-m": Object {
+          "$description": "The font size for default body text. For example, <p> tags in text content, or button text content.",
+          "$value": "14px",
+        },
+        "font-size-body-s": Object {
+          "$description": "The font size for small body text. For example, form field descriptions, or badge text.",
+          "$value": "12px",
+        },
+        "font-size-display-l": Object {
+          "$description": "The font size for large display text.",
+          "$value": "42px",
+        },
+        "font-size-heading-1": Object {
+          "$description": "The font size for h1s.",
+          "$value": "24px",
+        },
+        "font-size-heading-2": Object {
+          "$description": "The font size for h2s.",
+          "$value": "20px",
+        },
+        "font-size-heading-3": Object {
+          "$description": "The font size for h3s.",
+          "$value": "18px",
+        },
+        "font-size-heading-4": Object {
+          "$description": "The font size for h4s.",
+          "$value": "16px",
+        },
+        "font-size-heading-5": Object {
+          "$description": "The font size for h5s.",
+          "$value": "14px",
+        },
+        "font-weight-heading-1": Object {
+          "$description": "The font weight for h1s.",
+          "$value": "700",
+        },
+        "font-weight-heading-2": Object {
+          "$description": "The font weight for h2s.",
+          "$value": "700",
+        },
+        "font-weight-heading-3": Object {
+          "$description": "The font weight for h3s.",
+          "$value": "700",
+        },
+        "font-weight-heading-4": Object {
+          "$description": "The font weight for h4s.",
+          "$value": "700",
+        },
+        "font-weight-heading-5": Object {
+          "$description": "The font weight for h5s.",
+          "$value": "700",
+        },
+        "line-height-body-m": Object {
+          "$description": "The line height for default body text.",
+          "$value": "20px",
+        },
+        "line-height-body-s": Object {
+          "$description": "The line height for small body text.",
+          "$value": "16px",
+        },
+        "line-height-display-l": Object {
+          "$description": "The line height for large display text.",
+          "$value": "48px",
+        },
+        "line-height-heading-1": Object {
+          "$description": "The line height for h1s.",
+          "$value": "30px",
+        },
+        "line-height-heading-2": Object {
+          "$description": "The line height for h2s.",
+          "$value": "24px",
+        },
+        "line-height-heading-3": Object {
+          "$description": "The line height for h3s.",
+          "$value": "22px",
+        },
+        "line-height-heading-4": Object {
+          "$description": "The line height for h4s.",
+          "$value": "20px",
+        },
+        "line-height-heading-5": Object {
+          "$description": "The line height for h5s.",
+          "$value": "18px",
+        },
         "motion-duration-complex": Object {
           "$description": "The duration for drawing more attention or accommodating for more complexity.",
           "$value": Object {
@@ -20709,6 +21465,90 @@ Object {
           "$description": "The monospace font family that will be applied globally to the product interface.",
           "$value": "Monaco, Menlo, Consolas, 'Courier Prime', Courier, 'Courier New', monospace",
         },
+        "font-size-body-m": Object {
+          "$description": "The font size for default body text. For example, <p> tags in text content, or button text content.",
+          "$value": "14px",
+        },
+        "font-size-body-s": Object {
+          "$description": "The font size for small body text. For example, form field descriptions, or badge text.",
+          "$value": "12px",
+        },
+        "font-size-display-l": Object {
+          "$description": "The font size for large display text.",
+          "$value": "42px",
+        },
+        "font-size-heading-1": Object {
+          "$description": "The font size for h1s.",
+          "$value": "24px",
+        },
+        "font-size-heading-2": Object {
+          "$description": "The font size for h2s.",
+          "$value": "20px",
+        },
+        "font-size-heading-3": Object {
+          "$description": "The font size for h3s.",
+          "$value": "18px",
+        },
+        "font-size-heading-4": Object {
+          "$description": "The font size for h4s.",
+          "$value": "16px",
+        },
+        "font-size-heading-5": Object {
+          "$description": "The font size for h5s.",
+          "$value": "14px",
+        },
+        "font-weight-heading-1": Object {
+          "$description": "The font weight for h1s.",
+          "$value": "700",
+        },
+        "font-weight-heading-2": Object {
+          "$description": "The font weight for h2s.",
+          "$value": "700",
+        },
+        "font-weight-heading-3": Object {
+          "$description": "The font weight for h3s.",
+          "$value": "700",
+        },
+        "font-weight-heading-4": Object {
+          "$description": "The font weight for h4s.",
+          "$value": "700",
+        },
+        "font-weight-heading-5": Object {
+          "$description": "The font weight for h5s.",
+          "$value": "700",
+        },
+        "line-height-body-m": Object {
+          "$description": "The line height for default body text.",
+          "$value": "20px",
+        },
+        "line-height-body-s": Object {
+          "$description": "The line height for small body text.",
+          "$value": "16px",
+        },
+        "line-height-display-l": Object {
+          "$description": "The line height for large display text.",
+          "$value": "48px",
+        },
+        "line-height-heading-1": Object {
+          "$description": "The line height for h1s.",
+          "$value": "30px",
+        },
+        "line-height-heading-2": Object {
+          "$description": "The line height for h2s.",
+          "$value": "24px",
+        },
+        "line-height-heading-3": Object {
+          "$description": "The line height for h3s.",
+          "$value": "22px",
+        },
+        "line-height-heading-4": Object {
+          "$description": "The line height for h4s.",
+          "$value": "20px",
+        },
+        "line-height-heading-5": Object {
+          "$description": "The line height for h5s.",
+          "$value": "18px",
+        },
         "motion-duration-complex": Object {
           "$description": "The duration for drawing more attention or accommodating for more complexity.",
           "$value": Object {
@@ -22801,6 +23641,90 @@ Object {
           "$description": "The monospace font family that will be applied globally to the product interface.",
           "$value": "Monaco, Menlo, Consolas, 'Courier Prime', Courier, 'Courier New', monospace",
         },
+        "font-size-body-m": Object {
+          "$description": "The font size for default body text. For example, <p> tags in text content, or button text content.",
+          "$value": "14px",
+        },
+        "font-size-body-s": Object {
+          "$description": "The font size for small body text. For example, form field descriptions, or badge text.",
+          "$value": "12px",
+        },
+        "font-size-display-l": Object {
+          "$description": "The font size for large display text.",
+          "$value": "42px",
+        },
+        "font-size-heading-1": Object {
+          "$description": "The font size for h1s.",
+          "$value": "24px",
+        },
+        "font-size-heading-2": Object {
+          "$description": "The font size for h2s.",
+          "$value": "20px",
+        },
+        "font-size-heading-3": Object {
+          "$description": "The font size for h3s.",
+          "$value": "18px",
+        },
+        "font-size-heading-4": Object {
+          "$description": "The font size for h4s.",
+          "$value": "16px",
+        },
+        "font-size-heading-5": Object {
+          "$description": "The font size for h5s.",
+          "$value": "14px",
+        },
+        "font-weight-heading-1": Object {
+          "$description": "The font weight for h1s.",
+          "$value": "700",
+        },
+        "font-weight-heading-2": Object {
+          "$description": "The font weight for h2s.",
+          "$value": "700",
+        },
+        "font-weight-heading-3": Object {
+          "$description": "The font weight for h3s.",
+          "$value": "700",
+        },
+        "font-weight-heading-4": Object {
+          "$description": "The font weight for h4s.",
+          "$value": "700",
+        },
+        "font-weight-heading-5": Object {
+          "$description": "The font weight for h5s.",
+          "$value": "700",
+        },
+        "line-height-body-m": Object {
+          "$description": "The line height for default body text.",
+          "$value": "20px",
+        },
+        "line-height-body-s": Object {
+          "$description": "The line height for small body text.",
+          "$value": "16px",
+        },
+        "line-height-display-l": Object {
+          "$description": "The line height for large display text.",
+          "$value": "48px",
+        },
+        "line-height-heading-1": Object {
+          "$description": "The line height for h1s.",
+          "$value": "30px",
+        },
+        "line-height-heading-2": Object {
+          "$description": "The line height for h2s.",
+          "$value": "24px",
+        },
+        "line-height-heading-3": Object {
+          "$description": "The line height for h3s.",
+          "$value": "22px",
+        },
+        "line-height-heading-4": Object {
+          "$description": "The line height for h4s.",
+          "$value": "20px",
+        },
+        "line-height-heading-5": Object {
+          "$description": "The line height for h5s.",
+          "$value": "18px",
+        },
         "motion-duration-complex": Object {
           "$description": "The duration for drawing more attention or accommodating for more complexity.",
           "$value": Object {
@@ -24893,6 +25817,90 @@ Object {
           "$description": "The monospace font family that will be applied globally to the product interface.",
           "$value": "Monaco, Menlo, Consolas, 'Courier Prime', Courier, 'Courier New', monospace",
         },
+        "font-size-body-m": Object {
+          "$description": "The font size for default body text. For example, <p> tags in text content, or button text content.",
+          "$value": "14px",
+        },
+        "font-size-body-s": Object {
+          "$description": "The font size for small body text. For example, form field descriptions, or badge text.",
+          "$value": "12px",
+        },
+        "font-size-display-l": Object {
+          "$description": "The font size for large display text.",
+          "$value": "42px",
+        },
+        "font-size-heading-1": Object {
+          "$description": "The font size for h1s.",
+          "$value": "24px",
+        },
+        "font-size-heading-2": Object {
+          "$description": "The font size for h2s.",
+          "$value": "20px",
+        },
+        "font-size-heading-3": Object {
+          "$description": "The font size for h3s.",
+          "$value": "18px",
+        },
+        "font-size-heading-4": Object {
+          "$description": "The font size for h4s.",
+          "$value": "16px",
+        },
+        "font-size-heading-5": Object {
+          "$description": "The font size for h5s.",
+          "$value": "14px",
+        },
+        "font-weight-heading-1": Object {
+          "$description": "The font weight for h1s.",
+          "$value": "700",
+        },
+        "font-weight-heading-2": Object {
+          "$description": "The font weight for h2s.",
+          "$value": "700",
+        },
+        "font-weight-heading-3": Object {
+          "$description": "The font weight for h3s.",
+          "$value": "700",
+        },
+        "font-weight-heading-4": Object {
+          "$description": "The font weight for h4s.",
+          "$value": "700",
+        },
+        "font-weight-heading-5": Object {
+          "$description": "The font weight for h5s.",
+          "$value": "700",
+        },
+        "line-height-body-m": Object {
+          "$description": "The line height for default body text.",
+          "$value": "20px",
+        },
+        "line-height-body-s": Object {
+          "$description": "The line height for small body text.",
+          "$value": "16px",
+        },
+        "line-height-display-l": Object {
+          "$description": "The line height for large display text.",
+          "$value": "48px",
+        },
+        "line-height-heading-1": Object {
+          "$description": "The line height for h1s.",
+          "$value": "30px",
+        },
+        "line-height-heading-2": Object {
+          "$description": "The line height for h2s.",
+          "$value": "24px",
+        },
+        "line-height-heading-3": Object {
+          "$description": "The line height for h3s.",
+          "$value": "22px",
+        },
+        "line-height-heading-4": Object {
+          "$description": "The line height for h4s.",
+          "$value": "20px",
+        },
+        "line-height-heading-5": Object {
+          "$description": "The line height for h5s.",
+          "$value": "18px",
+        },
         "motion-duration-complex": Object {
           "$description": "The duration for drawing more attention or accommodating for more complexity.",
           "$value": Object {
@@ -26985,6 +27993,90 @@ Object {
           "$description": "The monospace font family that will be applied globally to the product interface.",
           "$value": "Monaco, Menlo, Consolas, 'Courier Prime', Courier, 'Courier New', monospace",
         },
+        "font-size-body-m": Object {
+          "$description": "The font size for default body text. For example, <p> tags in text content, or button text content.",
+          "$value": "14px",
+        },
+        "font-size-body-s": Object {
+          "$description": "The font size for small body text. For example, form field descriptions, or badge text.",
+          "$value": "12px",
+        },
+        "font-size-display-l": Object {
+          "$description": "The font size for large display text.",
+          "$value": "42px",
+        },
+        "font-size-heading-1": Object {
+          "$description": "The font size for h1s.",
+          "$value": "24px",
+        },
+        "font-size-heading-2": Object {
+          "$description": "The font size for h2s.",
+          "$value": "20px",
+        },
+        "font-size-heading-3": Object {
+          "$description": "The font size for h3s.",
+          "$value": "18px",
+        },
+        "font-size-heading-4": Object {
+          "$description": "The font size for h4s.",
+          "$value": "16px",
+        },
+        "font-size-heading-5": Object {
+          "$description": "The font size for h5s.",
+          "$value": "14px",
+        },
+        "font-weight-heading-1": Object {
+          "$description": "The font weight for h1s.",
+          "$value": "700",
+        },
+        "font-weight-heading-2": Object {
+          "$description": "The font weight for h2s.",
+          "$value": "700",
+        },
+        "font-weight-heading-3": Object {
+          "$description": "The font weight for h3s.",
+          "$value": "700",
+        },
+        "font-weight-heading-4": Object {
+          "$description": "The font weight for h4s.",
+          "$value": "700",
+        },
+        "font-weight-heading-5": Object {
+          "$description": "The font weight for h5s.",
+          "$value": "700",
+        },
+        "line-height-body-m": Object {
+          "$description": "The line height for default body text.",
+          "$value": "20px",
+        },
+        "line-height-body-s": Object {
+          "$description": "The line height for small body text.",
+          "$value": "16px",
+        },
+        "line-height-display-l": Object {
+          "$description": "The line height for large display text.",
+          "$value": "48px",
+        },
+        "line-height-heading-1": Object {
+          "$description": "The line height for h1s.",
+          "$value": "30px",
+        },
+        "line-height-heading-2": Object {
+          "$description": "The line height for h2s.",
+          "$value": "24px",
+        },
+        "line-height-heading-3": Object {
+          "$description": "The line height for h3s.",
+          "$value": "22px",
+        },
+        "line-height-heading-4": Object {
+          "$description": "The line height for h4s.",
+          "$value": "20px",
+        },
+        "line-height-heading-5": Object {
+          "$description": "The line height for h5s.",
+          "$value": "18px",
+        },
         "motion-duration-complex": Object {
           "$description": "The duration for drawing more attention or accommodating for more complexity.",
           "$value": Object {
@@ -29077,6 +30169,90 @@ Object {
       "$description": "The monospace font family that will be applied globally to the product interface.",
       "$value": "Monaco, Menlo, Consolas, 'Courier Prime', Courier, 'Courier New', monospace",
     },
+    "font-size-body-m": Object {
+      "$description": "The font size for default body text. For example, <p> tags in text content, or button text content.",
+      "$value": "14px",
+    },
+    "font-size-body-s": Object {
+      "$description": "The font size for small body text. For example, form field descriptions, or badge text.",
+      "$value": "12px",
+    },
+    "font-size-display-l": Object {
+      "$description": "The font size for large display text.",
+      "$value": "42px",
+    },
+    "font-size-heading-1": Object {
+      "$description": "The font size for h1s.",
+      "$value": "24px",
+    },
+    "font-size-heading-2": Object {
+      "$description": "The font size for h2s.",
+      "$value": "20px",
+    },
+    "font-size-heading-3": Object {
+      "$description": "The font size for h3s.",
+      "$value": "18px",
+    },
+    "font-size-heading-4": Object {
+      "$description": "The font size for h4s.",
+      "$value": "16px",
+    },
+    "font-size-heading-5": Object {
+      "$description": "The font size for h5s.",
+      "$value": "14px",
+    },
+    "font-weight-heading-1": Object {
+      "$description": "The font weight for h1s.",
+      "$value": "700",
+    },
+    "font-weight-heading-2": Object {
+      "$description": "The font weight for h2s.",
+      "$value": "700",
+    },
+    "font-weight-heading-3": Object {
+      "$description": "The font weight for h3s.",
+      "$value": "700",
+    },
+    "font-weight-heading-4": Object {
+      "$description": "The font weight for h4s.",
+      "$value": "700",
+    },
+    "font-weight-heading-5": Object {
+      "$description": "The font weight for h5s.",
+      "$value": "700",
+    },
+    "line-height-body-m": Object {
+      "$description": "The line height for default body text.",
+      "$value": "20px",
+    },
+    "line-height-body-s": Object {
+      "$description": "The line height for small body text.",
+      "$value": "16px",
+    },
+    "line-height-display-l": Object {
+      "$description": "The line height for large display text.",
+      "$value": "48px",
+    },
+    "line-height-heading-1": Object {
+      "$description": "The line height for h1s.",
+      "$value": "30px",
+    },
+    "line-height-heading-2": Object {
+      "$description": "The line height for h2s.",
+      "$value": "24px",
+    },
+    "line-height-heading-3": Object {
+      "$description": "The line height for h3s.",
+      "$value": "22px",
+    },
+    "line-height-heading-4": Object {
+      "$description": "The line height for h4s.",
+      "$value": "20px",
+    },
+    "line-height-heading-5": Object {
+      "$description": "The line height for h5s.",
+      "$value": "18px",
+    },
     "motion-duration-complex": Object {
       "$description": "The duration for drawing more attention or accommodating for more complexity.",
       "$value": Object {
diff --git a/style-dictionary/visual-refresh/metadata/typography.ts b/style-dictionary/visual-refresh/metadata/typography.ts
index 7d8c6817b5..016ed399a6 100644
--- a/style-dictionary/visual-refresh/metadata/typography.ts
+++ b/style-dictionary/visual-refresh/metadata/typography.ts
@@ -3,9 +3,18 @@
 import { StyleDictionary } from '../../utils/interfaces';
 
 const metadata: StyleDictionary.MetadataIndex = {
+  fontButtonLetterSpacing: {
+    description: 'The letter spacing for button text.',
+  },
+  fontButtonWeight: {
+    description: 'The font weight for button text.',
+  },
   fontChartDetailSize: {
     description: 'Used for secondary chart text, e.g. mixed chart axes and pie chart label descriptions.',
   },
+  fontDisplayLabelWeight: {
+    description: 'The font weight for labels. For example, keys in key-value pairs, or form field labels.',
+  },
   fontFamilyBase: {
     description: 'The default font family that will be applied globally to the product interface. ',
     themeable: true,
@@ -18,6 +27,130 @@ const metadata: StyleDictionary.MetadataIndex = {
   },
   fontHeaderH2DescriptionLineHeight: { sassName: '$font-header-h2-description-line-height' },
   fontHeaderH2DescriptionSize: { sassName: '$font-header-h2-description-size' },
+  fontSizeBodyM: {
+    description: 'The font size for default body text. For example, <p> tags in text content, or button text content.',
+    themeable: true,
+    public: true,
+  },
+  fontSizeBodyS: {
+    description: 'The font size for small body text. For example, form field descriptions, or badge text.',
+    themeable: true,
+    public: true,
+  },
+  fontSizeDisplayL: {
+    description: 'The font size for large display text.',
+    themeable: true,
+    public: true,
+  },
+  fontSizeHeading1: {
+    description: 'The font size for h1s.',
+    themeable: true,
+    public: true,
+  },
+  fontSizeHeading2: {
+    description: 'The font size for h2s.',
+    themeable: true,
+    public: true,
+  },
+  fontSizeHeading3: {
+    description: 'The font size for h3s.',
+    themeable: true,
+    public: true,
+  },
+  fontSizeHeading4: {
+    description: 'The font size for h4s.',
+    themeable: true,
+    public: true,
+  },
+  fontSizeHeading5: {
+    description: 'The font size for h5s.',
+    themeable: true,
+    public: true,
+  },
+
+  fontWeightHeading1: {
+    description: 'The font weight for h1s.',
+    themeable: true,
+    public: true,
+  },
+  fontWeightHeading2: {
+    description: 'The font weight for h2s.',
+    themeable: true,
+    public: true,
+  },
+  fontWeightHeading3: {
+    description: 'The font weight for h3s.',
+    themeable: true,
+    public: true,
+  },
+  fontWeightHeading4: {
+    description: 'The font weight for h4s.',
+    themeable: true,
+    public: true,
+  },
+  fontWeightHeading5: {
+    description: 'The font weight for h5s.',
+    themeable: true,
+    public: true,
+  },
+  letterSpacingBodyS: {
+    description: 'The letter spacing for small body text.',
+  },
+  letterSpacingDisplayL: {
+    description: 'The letter spacing for large display text.',
+  },
+  letterSpacingHeading1: {
+    description: 'The letter spacing for h1s.',
+  },
+  letterSpacingHeading2: {
+    description: 'The letter spacing for h2s.',
+  },
+  letterSpacingHeading3: {
+    description: 'The letter spacing for h3s.',
+  },
+  letterSpacingHeading4: {
+    description: 'The letter spacing for h4s.',
+  },
+  lineHeightBodyM: {
+    description: 'The line height for default body text.',
+    themeable: true,
+    public: true,
+  },
+  lineHeightBodyS: {
+    description: 'The line height for small body text.',
+    themeable: true,
+    public: true,
+  },
+  lineHeightDisplayL: {
+    description: 'The line height for large display text.',
+    themeable: true,
+    public: true,
+  },
+  lineHeightHeading1: {
+    description: 'The line height for h1s.',
+    themeable: true,
+    public: true,
+  },
+  lineHeightHeading2: {
+    description: 'The line height for h2s.',
+    themeable: true,
+    public: true,
+  },
+  lineHeightHeading3: {
+    description: 'The line height for h3s.',
+    themeable: true,
+    public: true,
+  },
+  lineHeightHeading4: {
+    description: 'The line height for h4s.',
+    themeable: true,
+    public: true,
+  },
+  lineHeightHeading5: {
+    description: 'The line height for h5s.',
+    themeable: true,
+    public: true,
+  },
 };
 
 export default metadata;