diff --git a/apps/www/app/_components/tokens/design-tokens/size-mode.json b/apps/www/app/_components/tokens/design-tokens/size-mode.json
index f3cc7093bc..56a15afae4 100644
--- a/apps/www/app/_components/tokens/design-tokens/size-mode.json
+++ b/apps/www/app/_components/tokens/design-tokens/size-mode.json
@@ -1,5 +1,21 @@
 {
   "medium": [
+    {
+      "path": [
+        "font-scale",
+        "_base"
+      ],
+      "variable": "--ds-font-scale-base",
+      "value": "1.125"
+    },
+    {
+      "path": [
+        "font-scale",
+        "_ratio"
+      ],
+      "variable": "--ds-font-scale-ratio",
+      "value": "1.143"
+    },
     {
       "path": [
         "_size",
@@ -10,6 +26,22 @@
     }
   ],
   "large": [
+    {
+      "path": [
+        "font-scale",
+        "_base"
+      ],
+      "variable": "--ds-font-scale-base",
+      "value": "1.3125"
+    },
+    {
+      "path": [
+        "font-scale",
+        "_ratio"
+      ],
+      "variable": "--ds-font-scale-ratio",
+      "value": "1.146"
+    },
     {
       "path": [
         "_size",
@@ -20,6 +52,22 @@
     }
   ],
   "small": [
+    {
+      "path": [
+        "font-scale",
+        "_base"
+      ],
+      "variable": "--ds-font-scale-base",
+      "value": "1"
+    },
+    {
+      "path": [
+        "font-scale",
+        "_ratio"
+      ],
+      "variable": "--ds-font-scale-ratio",
+      "value": "1.131"
+    },
     {
       "path": [
         "_size",
diff --git a/apps/www/app/_components/tokens/design-tokens/type-scale.json b/apps/www/app/_components/tokens/design-tokens/type-scale.json
index 59908f6503..14f70353e0 100644
--- a/apps/www/app/_components/tokens/design-tokens/type-scale.json
+++ b/apps/www/app/_components/tokens/design-tokens/type-scale.json
@@ -1,312 +1,248 @@
-[
-  {
-    "path": [
-      "font-size",
-      "1"
-    ],
-    "variable": "--ds-font-size-1",
-    "value": "round(calc(0.75rem * var(--_ds-font-size-factor)), 1px)"
-  },
-  {
-    "path": [
-      "font-size",
-      "2"
-    ],
-    "variable": "--ds-font-size-2",
-    "value": "round(calc(0.875rem * var(--_ds-font-size-factor)), 1px)"
-  },
-  {
-    "path": [
-      "font-size",
-      "3"
-    ],
-    "variable": "--ds-font-size-3",
-    "value": "round(calc(1rem * var(--_ds-font-size-factor)), 1px)"
-  },
-  {
-    "path": [
-      "font-size",
-      "4"
-    ],
-    "variable": "--ds-font-size-4",
-    "value": "round(calc(1.125rem * var(--_ds-font-size-factor)), 1px)"
-  },
-  {
-    "path": [
-      "font-size",
-      "5"
-    ],
-    "variable": "--ds-font-size-5",
-    "value": "round(calc(1.3125rem * var(--_ds-font-size-factor)), 1px)"
-  },
-  {
-    "path": [
-      "font-size",
-      "6"
-    ],
-    "variable": "--ds-font-size-6",
-    "value": "round(calc(1.5rem * var(--_ds-font-size-factor)), 1px)"
-  },
-  {
-    "path": [
-      "font-size",
-      "7"
-    ],
-    "variable": "--ds-font-size-7",
-    "value": "round(calc(1.875rem * var(--_ds-font-size-factor)), 1px)"
-  },
-  {
-    "path": [
-      "font-size",
-      "8"
-    ],
-    "variable": "--ds-font-size-8",
-    "value": "round(calc(2.25rem * var(--_ds-font-size-factor)), 1px)"
-  },
-  {
-    "path": [
-      "font-size",
-      "9"
-    ],
-    "variable": "--ds-font-size-9",
-    "value": "round(calc(3rem * var(--_ds-font-size-factor)), 1px)"
-  },
-  {
-    "path": [
-      "font-size",
-      "10"
-    ],
-    "variable": "--ds-font-size-10",
-    "value": "round(calc(3.75rem * var(--_ds-font-size-factor)), 1px)"
-  },
-  {
-    "path": [
-      "typography",
-      "heading",
-      "2xl",
-      "fontSize"
-    ],
-    "variable": "--ds-heading-2xl-font-size",
-    "value": "var(--ds-font-size-10)"
-  },
-  {
-    "path": [
-      "typography",
-      "heading",
-      "xl",
-      "fontSize"
-    ],
-    "variable": "--ds-heading-xl-font-size",
-    "value": "var(--ds-font-size-9)"
-  },
-  {
-    "path": [
-      "typography",
-      "heading",
-      "lg",
-      "fontSize"
-    ],
-    "variable": "--ds-heading-lg-font-size",
-    "value": "var(--ds-font-size-8)"
-  },
-  {
-    "path": [
-      "typography",
-      "heading",
-      "md",
-      "fontSize"
-    ],
-    "variable": "--ds-heading-md-font-size",
-    "value": "var(--ds-font-size-7)"
-  },
-  {
-    "path": [
-      "typography",
-      "heading",
-      "sm",
-      "fontSize"
-    ],
-    "variable": "--ds-heading-sm-font-size",
-    "value": "var(--ds-font-size-6)"
-  },
-  {
-    "path": [
-      "typography",
-      "heading",
-      "xs",
-      "fontSize"
-    ],
-    "variable": "--ds-heading-xs-font-size",
-    "value": "var(--ds-font-size-5)"
-  },
-  {
-    "path": [
-      "typography",
-      "heading",
-      "2xs",
-      "fontSize"
-    ],
-    "variable": "--ds-heading-2xs-font-size",
-    "value": "var(--ds-font-size-4)"
-  },
-  {
-    "path": [
-      "typography",
-      "body",
-      "xl",
-      "fontSize"
-    ],
-    "variable": "--ds-body-xl-font-size",
-    "value": "var(--ds-font-size-6)"
-  },
-  {
-    "path": [
-      "typography",
-      "body",
-      "lg",
-      "fontSize"
-    ],
-    "variable": "--ds-body-lg-font-size",
-    "value": "var(--ds-font-size-5)"
-  },
-  {
-    "path": [
-      "typography",
-      "body",
-      "md",
-      "fontSize"
-    ],
-    "variable": "--ds-body-md-font-size",
-    "value": "var(--ds-font-size-4)"
-  },
-  {
-    "path": [
-      "typography",
-      "body",
-      "sm",
-      "fontSize"
-    ],
-    "variable": "--ds-body-sm-font-size",
-    "value": "var(--ds-font-size-3)"
-  },
-  {
-    "path": [
-      "typography",
-      "body",
-      "xs",
-      "fontSize"
-    ],
-    "variable": "--ds-body-xs-font-size",
-    "value": "var(--ds-font-size-2)"
-  },
-  {
-    "path": [
-      "typography",
-      "body",
-      "short",
-      "xl",
-      "fontSize"
-    ],
-    "variable": "--ds-body-short-xl-font-size",
-    "value": "var(--ds-font-size-6)"
-  },
-  {
-    "path": [
-      "typography",
-      "body",
-      "short",
-      "lg",
-      "fontSize"
-    ],
-    "variable": "--ds-body-short-lg-font-size",
-    "value": "var(--ds-font-size-5)"
-  },
-  {
-    "path": [
-      "typography",
-      "body",
-      "short",
-      "md",
-      "fontSize"
-    ],
-    "variable": "--ds-body-short-md-font-size",
-    "value": "var(--ds-font-size-4)"
-  },
-  {
-    "path": [
-      "typography",
-      "body",
-      "short",
-      "sm",
-      "fontSize"
-    ],
-    "variable": "--ds-body-short-sm-font-size",
-    "value": "var(--ds-font-size-3)"
-  },
-  {
-    "path": [
-      "typography",
-      "body",
-      "short",
-      "xs",
-      "fontSize"
-    ],
-    "variable": "--ds-body-short-xs-font-size",
-    "value": "var(--ds-font-size-2)"
-  },
-  {
-    "path": [
-      "typography",
-      "body",
-      "long",
-      "xl",
-      "fontSize"
-    ],
-    "variable": "--ds-body-long-xl-font-size",
-    "value": "var(--ds-font-size-6)"
-  },
-  {
-    "path": [
-      "typography",
-      "body",
-      "long",
-      "lg",
-      "fontSize"
-    ],
-    "variable": "--ds-body-long-lg-font-size",
-    "value": "var(--ds-font-size-5)"
-  },
-  {
-    "path": [
-      "typography",
-      "body",
-      "long",
-      "md",
-      "fontSize"
-    ],
-    "variable": "--ds-body-long-md-font-size",
-    "value": "var(--ds-font-size-4)"
-  },
-  {
-    "path": [
-      "typography",
-      "body",
-      "long",
-      "sm",
-      "fontSize"
-    ],
-    "variable": "--ds-body-long-sm-font-size",
-    "value": "var(--ds-font-size-3)"
-  },
-  {
-    "path": [
-      "typography",
-      "body",
-      "long",
-      "xs",
-      "fontSize"
-    ],
-    "variable": "--ds-body-long-xs-font-size",
-    "value": "var(--ds-font-size-2)"
-  }
-]
\ No newline at end of file
+{
+  "medium": [
+    {
+      "path": [
+        "font-size",
+        "1"
+      ],
+      "variable": "--ds-font-size-1",
+      "value": "0.75rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "2"
+      ],
+      "variable": "--ds-font-size-2",
+      "value": "0.875rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "3"
+      ],
+      "variable": "--ds-font-size-3",
+      "value": "1rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "4"
+      ],
+      "variable": "--ds-font-size-4",
+      "value": "1.125rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "5"
+      ],
+      "variable": "--ds-font-size-5",
+      "value": "1.3125rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "6"
+      ],
+      "variable": "--ds-font-size-6",
+      "value": "1.5rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "7"
+      ],
+      "variable": "--ds-font-size-7",
+      "value": "1.6875rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "8"
+      ],
+      "variable": "--ds-font-size-8",
+      "value": "2.1875rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "9"
+      ],
+      "variable": "--ds-font-size-9",
+      "value": "2.875rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "10"
+      ],
+      "variable": "--ds-font-size-10",
+      "value": "3.75rem"
+    }
+  ],
+  "large": [
+    {
+      "path": [
+        "font-size",
+        "1"
+      ],
+      "variable": "--ds-font-size-1",
+      "value": "0.875rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "2"
+      ],
+      "variable": "--ds-font-size-2",
+      "value": "1rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "3"
+      ],
+      "variable": "--ds-font-size-3",
+      "value": "1.125rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "4"
+      ],
+      "variable": "--ds-font-size-4",
+      "value": "1.3125rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "5"
+      ],
+      "variable": "--ds-font-size-5",
+      "value": "1.5rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "6"
+      ],
+      "variable": "--ds-font-size-6",
+      "value": "1.75rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "7"
+      ],
+      "variable": "--ds-font-size-7",
+      "value": "2rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "8"
+      ],
+      "variable": "--ds-font-size-8",
+      "value": "2.625rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "9"
+      ],
+      "variable": "--ds-font-size-9",
+      "value": "3.4375rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "10"
+      ],
+      "variable": "--ds-font-size-10",
+      "value": "4.5rem"
+    }
+  ],
+  "small": [
+    {
+      "path": [
+        "font-size",
+        "1"
+      ],
+      "variable": "--ds-font-size-1",
+      "value": "0.6875rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "2"
+      ],
+      "variable": "--ds-font-size-2",
+      "value": "0.8125rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "3"
+      ],
+      "variable": "--ds-font-size-3",
+      "value": "0.875rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "4"
+      ],
+      "variable": "--ds-font-size-4",
+      "value": "1rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "5"
+      ],
+      "variable": "--ds-font-size-5",
+      "value": "1.125rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "6"
+      ],
+      "variable": "--ds-font-size-6",
+      "value": "1.25rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "7"
+      ],
+      "variable": "--ds-font-size-7",
+      "value": "1.4375rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "8"
+      ],
+      "variable": "--ds-font-size-8",
+      "value": "1.875rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "9"
+      ],
+      "variable": "--ds-font-size-9",
+      "value": "2.375rem"
+    },
+    {
+      "path": [
+        "font-size",
+        "10"
+      ],
+      "variable": "--ds-font-size-10",
+      "value": "3rem"
+    }
+  ]
+}
\ No newline at end of file
diff --git a/design-tokens/$metadata.json b/design-tokens/$metadata.json
index 4bab0d99e1..fd6c430fb9 100644
--- a/design-tokens/$metadata.json
+++ b/design-tokens/$metadata.json
@@ -1,10 +1,11 @@
 {
   "tokenSetOrder": [
     "primitives/globals",
+    "primitives/modes/size/global",
     "primitives/modes/size/small",
     "primitives/modes/size/medium",
     "primitives/modes/size/large",
-    "primitives/modes/size/global",
+    "primitives/modes/typography/size/global",
     "primitives/modes/typography/size/small",
     "primitives/modes/typography/size/medium",
     "primitives/modes/typography/size/large",
diff --git a/design-tokens/$themes.json b/design-tokens/$themes.json
index 299e32e964..a6528bac1f 100644
--- a/design-tokens/$themes.json
+++ b/design-tokens/$themes.json
@@ -6,7 +6,8 @@
     "selectedTokenSets": {
       "primitives/modes/size/medium": "source",
       "primitives/modes/size/global": "enabled",
-      "primitives/modes/typography/size/medium": "enabled"
+      "primitives/modes/typography/size/medium": "source",
+      "primitives/modes/typography/size/global": "enabled"
     },
     "$figmaCollectionId": "VariableCollectionId:36248:20757",
     "$figmaModeId": "41630:1",
@@ -19,7 +20,8 @@
     "selectedTokenSets": {
       "primitives/modes/size/large": "source",
       "primitives/modes/size/global": "enabled",
-      "primitives/modes/typography/size/large": "enabled"
+      "primitives/modes/typography/size/large": "source",
+      "primitives/modes/typography/size/global": "enabled"
     },
     "$figmaCollectionId": "VariableCollectionId:36248:20757",
     "$figmaModeId": "41630:2",
@@ -32,7 +34,8 @@
     "selectedTokenSets": {
       "primitives/modes/size/small": "source",
       "primitives/modes/size/global": "enabled",
-      "primitives/modes/typography/size/small": "enabled"
+      "primitives/modes/typography/size/small": "source",
+      "primitives/modes/typography/size/global": "enabled"
     },
     "$figmaCollectionId": "VariableCollectionId:36248:20757",
     "$figmaModeId": "41630:3",
diff --git a/design-tokens/primitives/modes/typography/size/global.json b/design-tokens/primitives/modes/typography/size/global.json
new file mode 100644
index 0000000000..a3dd5469ea
--- /dev/null
+++ b/design-tokens/primitives/modes/typography/size/global.json
@@ -0,0 +1,96 @@
+{
+  "line-height": {
+    "sm": {
+      "$type": "lineHeights",
+      "$value": "130%"
+    },
+    "md": {
+      "$type": "lineHeights",
+      "$value": "150%"
+    },
+    "lg": {
+      "$type": "lineHeights",
+      "$value": "170%"
+    }
+  },
+  "font-size": {
+    "1": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} / pow({font-scale._ratio}, 3), 0)"
+    },
+    "2": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} / pow({font-scale._ratio}, 2), 0)"
+    },
+    "3": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} / pow({font-scale._ratio}, 1), 0)"
+    },
+    "4": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} * pow({font-scale._ratio}, 0), 0)"
+    },
+    "5": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} * pow({font-scale._ratio}, 1), 0)"
+    },
+    "6": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} * pow({font-scale._ratio}, 2), 0)"
+    },
+    "7": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} * pow({font-scale._ratio}, 3), 0)"
+    },
+    "8": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} * pow({font-scale._ratio}, 5), 0)"
+    },
+    "9": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} * pow({font-scale._ratio}, 7), 0)"
+    },
+    "10": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} * pow({font-scale._ratio}, 9), 0)"
+    }
+  },
+  "letter-spacing": {
+    "1": {
+      "$type": "letterSpacing",
+      "$value": "-1%"
+    },
+    "2": {
+      "$type": "letterSpacing",
+      "$value": "-0.5%"
+    },
+    "3": {
+      "$type": "letterSpacing",
+      "$value": "-0.25%"
+    },
+    "4": {
+      "$type": "letterSpacing",
+      "$value": "-0.15%"
+    },
+    "5": {
+      "$type": "letterSpacing",
+      "$value": "0%"
+    },
+    "6": {
+      "$type": "letterSpacing",
+      "$value": "0.15%"
+    },
+    "7": {
+      "$type": "letterSpacing",
+      "$value": "0.25%"
+    },
+    "8": {
+      "$type": "letterSpacing",
+      "$value": "0.5%"
+    },
+    "9": {
+      "$type": "letterSpacing",
+      "$value": "1.5%"
+    }
+  }
+}
\ No newline at end of file
diff --git a/design-tokens/primitives/modes/typography/size/large.json b/design-tokens/primitives/modes/typography/size/large.json
index 9d7ed9b3e6..d423e72542 100644
--- a/design-tokens/primitives/modes/typography/size/large.json
+++ b/design-tokens/primitives/modes/typography/size/large.json
@@ -1,96 +1,14 @@
 {
-  "line-height": {
-    "sm": {
-      "$type": "lineHeights",
-      "$value": "130%"
-    },
-    "md": {
-      "$type": "lineHeights",
-      "$value": "150%"
-    },
-    "lg": {
-      "$type": "lineHeights",
-      "$value": "170%"
-    }
-  },
-  "font-size": {
-    "1": {
-      "$type": "fontSizes",
-      "$value": "13"
-    },
-    "2": {
-      "$type": "fontSizes",
-      "$value": "16"
-    },
-    "3": {
-      "$type": "fontSizes",
-      "$value": "18"
-    },
-    "4": {
-      "$type": "fontSizes",
-      "$value": "21"
-    },
-    "5": {
-      "$type": "fontSizes",
-      "$value": "24"
-    },
-    "6": {
-      "$type": "fontSizes",
-      "$value": "30"
-    },
-    "7": {
-      "$type": "fontSizes",
-      "$value": "36"
-    },
-    "8": {
-      "$type": "fontSizes",
-      "$value": "48"
-    },
-    "9": {
-      "$type": "fontSizes",
-      "$value": "60"
-    },
-    "10": {
-      "$type": "fontSizes",
-      "$value": "72"
-    }
-  },
-  "letter-spacing": {
-    "1": {
-      "$type": "letterSpacing",
-      "$value": "-1%"
-    },
-    "2": {
-      "$type": "letterSpacing",
-      "$value": "-0.5%"
-    },
-    "3": {
-      "$type": "letterSpacing",
-      "$value": "-0.25%"
-    },
-    "4": {
-      "$type": "letterSpacing",
-      "$value": "-0.15%"
-    },
-    "5": {
-      "$type": "letterSpacing",
-      "$value": "0%"
-    },
-    "6": {
-      "$type": "letterSpacing",
-      "$value": "0.15%"
-    },
-    "7": {
-      "$type": "letterSpacing",
-      "$value": "0.25%"
-    },
-    "8": {
-      "$type": "letterSpacing",
-      "$value": "0.5%"
-    },
-    "9": {
-      "$type": "letterSpacing",
-      "$value": "1.5%"
+  "font-scale": {
+    "_base": {
+      "$type": "number",
+      "$value": "21",
+      "$description": "The font size (in px) to use as the basis for the scale. Is used as font-size.4."
+    },
+    "_ratio": {
+      "$type": "number",
+      "$value": "1.146",
+      "$description": "The ratio used to calculate each step in the scale. Must be larger than 1 (a ratio of 1 would make all font sizes the same, while a number between 0 and 1 effectively inverts the scale). Larger numbers result in a larger font-size.10 and a smaller font-size.1."
     }
   }
 }
\ No newline at end of file
diff --git a/design-tokens/primitives/modes/typography/size/medium.json b/design-tokens/primitives/modes/typography/size/medium.json
index f861fb854c..0131aa6148 100644
--- a/design-tokens/primitives/modes/typography/size/medium.json
+++ b/design-tokens/primitives/modes/typography/size/medium.json
@@ -1,96 +1,14 @@
 {
-  "line-height": {
-    "sm": {
-      "$type": "lineHeights",
-      "$value": "130%"
-    },
-    "md": {
-      "$type": "lineHeights",
-      "$value": "150%"
-    },
-    "lg": {
-      "$type": "lineHeights",
-      "$value": "170%"
-    }
-  },
-  "font-size": {
-    "1": {
-      "$type": "fontSizes",
-      "$value": "12"
-    },
-    "2": {
-      "$type": "fontSizes",
-      "$value": "14"
-    },
-    "3": {
-      "$type": "fontSizes",
-      "$value": "16"
-    },
-    "4": {
-      "$type": "fontSizes",
-      "$value": "18"
-    },
-    "5": {
-      "$type": "fontSizes",
-      "$value": "21"
-    },
-    "6": {
-      "$type": "fontSizes",
-      "$value": "24"
-    },
-    "7": {
-      "$type": "fontSizes",
-      "$value": "30"
-    },
-    "8": {
-      "$type": "fontSizes",
-      "$value": "36"
-    },
-    "9": {
-      "$type": "fontSizes",
-      "$value": "48"
-    },
-    "10": {
-      "$type": "fontSizes",
-      "$value": "60"
-    }
-  },
-  "letter-spacing": {
-    "1": {
-      "$type": "letterSpacing",
-      "$value": "-1%"
-    },
-    "2": {
-      "$type": "letterSpacing",
-      "$value": "-0.5%"
-    },
-    "3": {
-      "$type": "letterSpacing",
-      "$value": "-0.25%"
-    },
-    "4": {
-      "$type": "letterSpacing",
-      "$value": "-0.15%"
-    },
-    "5": {
-      "$type": "letterSpacing",
-      "$value": "0%"
-    },
-    "6": {
-      "$type": "letterSpacing",
-      "$value": "0.15%"
-    },
-    "7": {
-      "$type": "letterSpacing",
-      "$value": "0.25%"
-    },
-    "8": {
-      "$type": "letterSpacing",
-      "$value": "0.5%"
-    },
-    "9": {
-      "$type": "letterSpacing",
-      "$value": "1.5%"
+  "font-scale": {
+    "_base": {
+      "$type": "number",
+      "$value": "18",
+      "$description": "The font size (in px) to use as the basis for the scale. Is used as font-size.4."
+    },
+    "_ratio": {
+      "$type": "number",
+      "$value": "1.143",
+      "$description": "The ratio used to calculate each step in the scale. Must be larger than 1 (a ratio of 1 would make all font sizes the same, while a number between 0 and 1 effectively inverts the scale). Larger numbers result in a larger font-size.10 and a smaller font-size.1."
     }
   }
 }
\ No newline at end of file
diff --git a/design-tokens/primitives/modes/typography/size/small.json b/design-tokens/primitives/modes/typography/size/small.json
index 99e67f561f..4ed462d883 100644
--- a/design-tokens/primitives/modes/typography/size/small.json
+++ b/design-tokens/primitives/modes/typography/size/small.json
@@ -1,96 +1,14 @@
 {
-  "line-height": {
-    "sm": {
-      "$type": "lineHeights",
-      "$value": "130%"
-    },
-    "md": {
-      "$type": "lineHeights",
-      "$value": "150%"
-    },
-    "lg": {
-      "$type": "lineHeights",
-      "$value": "170%"
-    }
-  },
-  "font-size": {
-    "1": {
-      "$type": "fontSizes",
-      "$value": "11"
-    },
-    "2": {
-      "$type": "fontSizes",
-      "$value": "13"
-    },
-    "3": {
-      "$type": "fontSizes",
-      "$value": "14"
-    },
-    "4": {
-      "$type": "fontSizes",
-      "$value": "16"
-    },
-    "5": {
-      "$type": "fontSizes",
-      "$value": "18"
-    },
-    "6": {
-      "$type": "fontSizes",
-      "$value": "21"
-    },
-    "7": {
-      "$type": "fontSizes",
-      "$value": "24"
-    },
-    "8": {
-      "$type": "fontSizes",
-      "$value": "30"
-    },
-    "9": {
-      "$type": "fontSizes",
-      "$value": "36"
-    },
-    "10": {
-      "$type": "fontSizes",
-      "$value": "48"
-    }
-  },
-  "letter-spacing": {
-    "1": {
-      "$type": "letterSpacing",
-      "$value": "-1%"
-    },
-    "2": {
-      "$type": "letterSpacing",
-      "$value": "-0.5%"
-    },
-    "3": {
-      "$type": "letterSpacing",
-      "$value": "-0.25%"
-    },
-    "4": {
-      "$type": "letterSpacing",
-      "$value": "-0.15%"
-    },
-    "5": {
-      "$type": "letterSpacing",
-      "$value": "0%"
-    },
-    "6": {
-      "$type": "letterSpacing",
-      "$value": "0.15%"
-    },
-    "7": {
-      "$type": "letterSpacing",
-      "$value": "0.25%"
-    },
-    "8": {
-      "$type": "letterSpacing",
-      "$value": "0.5%"
-    },
-    "9": {
-      "$type": "letterSpacing",
-      "$value": "1.5%"
+  "font-scale": {
+    "_base": {
+      "$type": "number",
+      "$value": "16",
+      "$description": "The font size (in px) to use as the basis for the scale. Is used as font-size.4."
+    },
+    "_ratio": {
+      "$type": "number",
+      "$value": "1.131",
+      "$description": "The ratio used to calculate each step in the scale. Must be larger than 1 (a ratio of 1 would make all font sizes the same, while a number between 0 and 1 effectively inverts the scale). Larger numbers result in a larger font-size.10 and a smaller font-size.1."
     }
   }
 }
\ No newline at end of file
diff --git a/internal/design-tokens/$metadata.json b/internal/design-tokens/$metadata.json
index b20ca9b8e5..82ce9e910c 100644
--- a/internal/design-tokens/$metadata.json
+++ b/internal/design-tokens/$metadata.json
@@ -1,10 +1,11 @@
 {
   "tokenSetOrder": [
     "primitives/globals",
+    "primitives/modes/size/global",
     "primitives/modes/size/small",
     "primitives/modes/size/medium",
     "primitives/modes/size/large",
-    "primitives/modes/size/global",
+    "primitives/modes/typography/size/global",
     "primitives/modes/typography/size/small",
     "primitives/modes/typography/size/medium",
     "primitives/modes/typography/size/large",
diff --git a/internal/design-tokens/$themes.json b/internal/design-tokens/$themes.json
index d8f1f1d4c4..3625e1b181 100644
--- a/internal/design-tokens/$themes.json
+++ b/internal/design-tokens/$themes.json
@@ -6,7 +6,8 @@
     "selectedTokenSets": {
       "primitives/modes/size/medium": "source",
       "primitives/modes/size/global": "enabled",
-      "primitives/modes/typography/size/medium": "enabled"
+      "primitives/modes/typography/size/medium": "enabled",
+      "primitives/modes/typography/size/global": "enabled"
     },
     "$figmaCollectionId": "VariableCollectionId:36248:20757",
     "$figmaModeId": "41630:1",
@@ -55,7 +56,8 @@
     "selectedTokenSets": {
       "primitives/modes/size/large": "source",
       "primitives/modes/size/global": "enabled",
-      "primitives/modes/typography/size/large": "enabled"
+      "primitives/modes/typography/size/large": "enabled",
+      "primitives/modes/typography/size/global": "enabled"
     },
     "$figmaCollectionId": "VariableCollectionId:36248:20757",
     "$figmaModeId": "41630:2",
@@ -104,7 +106,8 @@
     "selectedTokenSets": {
       "primitives/modes/size/small": "source",
       "primitives/modes/size/global": "enabled",
-      "primitives/modes/typography/size/small": "enabled"
+      "primitives/modes/typography/size/small": "enabled",
+      "primitives/modes/typography/size/global": "enabled"
     },
     "$figmaCollectionId": "VariableCollectionId:36248:20757",
     "$figmaModeId": "41630:3",
diff --git a/internal/design-tokens/primitives/modes/typography/size/global.json b/internal/design-tokens/primitives/modes/typography/size/global.json
new file mode 100644
index 0000000000..a3dd5469ea
--- /dev/null
+++ b/internal/design-tokens/primitives/modes/typography/size/global.json
@@ -0,0 +1,96 @@
+{
+  "line-height": {
+    "sm": {
+      "$type": "lineHeights",
+      "$value": "130%"
+    },
+    "md": {
+      "$type": "lineHeights",
+      "$value": "150%"
+    },
+    "lg": {
+      "$type": "lineHeights",
+      "$value": "170%"
+    }
+  },
+  "font-size": {
+    "1": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} / pow({font-scale._ratio}, 3), 0)"
+    },
+    "2": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} / pow({font-scale._ratio}, 2), 0)"
+    },
+    "3": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} / pow({font-scale._ratio}, 1), 0)"
+    },
+    "4": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} * pow({font-scale._ratio}, 0), 0)"
+    },
+    "5": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} * pow({font-scale._ratio}, 1), 0)"
+    },
+    "6": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} * pow({font-scale._ratio}, 2), 0)"
+    },
+    "7": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} * pow({font-scale._ratio}, 3), 0)"
+    },
+    "8": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} * pow({font-scale._ratio}, 5), 0)"
+    },
+    "9": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} * pow({font-scale._ratio}, 7), 0)"
+    },
+    "10": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} * pow({font-scale._ratio}, 9), 0)"
+    }
+  },
+  "letter-spacing": {
+    "1": {
+      "$type": "letterSpacing",
+      "$value": "-1%"
+    },
+    "2": {
+      "$type": "letterSpacing",
+      "$value": "-0.5%"
+    },
+    "3": {
+      "$type": "letterSpacing",
+      "$value": "-0.25%"
+    },
+    "4": {
+      "$type": "letterSpacing",
+      "$value": "-0.15%"
+    },
+    "5": {
+      "$type": "letterSpacing",
+      "$value": "0%"
+    },
+    "6": {
+      "$type": "letterSpacing",
+      "$value": "0.15%"
+    },
+    "7": {
+      "$type": "letterSpacing",
+      "$value": "0.25%"
+    },
+    "8": {
+      "$type": "letterSpacing",
+      "$value": "0.5%"
+    },
+    "9": {
+      "$type": "letterSpacing",
+      "$value": "1.5%"
+    }
+  }
+}
\ No newline at end of file
diff --git a/internal/design-tokens/primitives/modes/typography/size/large.json b/internal/design-tokens/primitives/modes/typography/size/large.json
index 9d7ed9b3e6..d423e72542 100644
--- a/internal/design-tokens/primitives/modes/typography/size/large.json
+++ b/internal/design-tokens/primitives/modes/typography/size/large.json
@@ -1,96 +1,14 @@
 {
-  "line-height": {
-    "sm": {
-      "$type": "lineHeights",
-      "$value": "130%"
-    },
-    "md": {
-      "$type": "lineHeights",
-      "$value": "150%"
-    },
-    "lg": {
-      "$type": "lineHeights",
-      "$value": "170%"
-    }
-  },
-  "font-size": {
-    "1": {
-      "$type": "fontSizes",
-      "$value": "13"
-    },
-    "2": {
-      "$type": "fontSizes",
-      "$value": "16"
-    },
-    "3": {
-      "$type": "fontSizes",
-      "$value": "18"
-    },
-    "4": {
-      "$type": "fontSizes",
-      "$value": "21"
-    },
-    "5": {
-      "$type": "fontSizes",
-      "$value": "24"
-    },
-    "6": {
-      "$type": "fontSizes",
-      "$value": "30"
-    },
-    "7": {
-      "$type": "fontSizes",
-      "$value": "36"
-    },
-    "8": {
-      "$type": "fontSizes",
-      "$value": "48"
-    },
-    "9": {
-      "$type": "fontSizes",
-      "$value": "60"
-    },
-    "10": {
-      "$type": "fontSizes",
-      "$value": "72"
-    }
-  },
-  "letter-spacing": {
-    "1": {
-      "$type": "letterSpacing",
-      "$value": "-1%"
-    },
-    "2": {
-      "$type": "letterSpacing",
-      "$value": "-0.5%"
-    },
-    "3": {
-      "$type": "letterSpacing",
-      "$value": "-0.25%"
-    },
-    "4": {
-      "$type": "letterSpacing",
-      "$value": "-0.15%"
-    },
-    "5": {
-      "$type": "letterSpacing",
-      "$value": "0%"
-    },
-    "6": {
-      "$type": "letterSpacing",
-      "$value": "0.15%"
-    },
-    "7": {
-      "$type": "letterSpacing",
-      "$value": "0.25%"
-    },
-    "8": {
-      "$type": "letterSpacing",
-      "$value": "0.5%"
-    },
-    "9": {
-      "$type": "letterSpacing",
-      "$value": "1.5%"
+  "font-scale": {
+    "_base": {
+      "$type": "number",
+      "$value": "21",
+      "$description": "The font size (in px) to use as the basis for the scale. Is used as font-size.4."
+    },
+    "_ratio": {
+      "$type": "number",
+      "$value": "1.146",
+      "$description": "The ratio used to calculate each step in the scale. Must be larger than 1 (a ratio of 1 would make all font sizes the same, while a number between 0 and 1 effectively inverts the scale). Larger numbers result in a larger font-size.10 and a smaller font-size.1."
     }
   }
 }
\ No newline at end of file
diff --git a/internal/design-tokens/primitives/modes/typography/size/medium.json b/internal/design-tokens/primitives/modes/typography/size/medium.json
index f861fb854c..0131aa6148 100644
--- a/internal/design-tokens/primitives/modes/typography/size/medium.json
+++ b/internal/design-tokens/primitives/modes/typography/size/medium.json
@@ -1,96 +1,14 @@
 {
-  "line-height": {
-    "sm": {
-      "$type": "lineHeights",
-      "$value": "130%"
-    },
-    "md": {
-      "$type": "lineHeights",
-      "$value": "150%"
-    },
-    "lg": {
-      "$type": "lineHeights",
-      "$value": "170%"
-    }
-  },
-  "font-size": {
-    "1": {
-      "$type": "fontSizes",
-      "$value": "12"
-    },
-    "2": {
-      "$type": "fontSizes",
-      "$value": "14"
-    },
-    "3": {
-      "$type": "fontSizes",
-      "$value": "16"
-    },
-    "4": {
-      "$type": "fontSizes",
-      "$value": "18"
-    },
-    "5": {
-      "$type": "fontSizes",
-      "$value": "21"
-    },
-    "6": {
-      "$type": "fontSizes",
-      "$value": "24"
-    },
-    "7": {
-      "$type": "fontSizes",
-      "$value": "30"
-    },
-    "8": {
-      "$type": "fontSizes",
-      "$value": "36"
-    },
-    "9": {
-      "$type": "fontSizes",
-      "$value": "48"
-    },
-    "10": {
-      "$type": "fontSizes",
-      "$value": "60"
-    }
-  },
-  "letter-spacing": {
-    "1": {
-      "$type": "letterSpacing",
-      "$value": "-1%"
-    },
-    "2": {
-      "$type": "letterSpacing",
-      "$value": "-0.5%"
-    },
-    "3": {
-      "$type": "letterSpacing",
-      "$value": "-0.25%"
-    },
-    "4": {
-      "$type": "letterSpacing",
-      "$value": "-0.15%"
-    },
-    "5": {
-      "$type": "letterSpacing",
-      "$value": "0%"
-    },
-    "6": {
-      "$type": "letterSpacing",
-      "$value": "0.15%"
-    },
-    "7": {
-      "$type": "letterSpacing",
-      "$value": "0.25%"
-    },
-    "8": {
-      "$type": "letterSpacing",
-      "$value": "0.5%"
-    },
-    "9": {
-      "$type": "letterSpacing",
-      "$value": "1.5%"
+  "font-scale": {
+    "_base": {
+      "$type": "number",
+      "$value": "18",
+      "$description": "The font size (in px) to use as the basis for the scale. Is used as font-size.4."
+    },
+    "_ratio": {
+      "$type": "number",
+      "$value": "1.143",
+      "$description": "The ratio used to calculate each step in the scale. Must be larger than 1 (a ratio of 1 would make all font sizes the same, while a number between 0 and 1 effectively inverts the scale). Larger numbers result in a larger font-size.10 and a smaller font-size.1."
     }
   }
 }
\ No newline at end of file
diff --git a/internal/design-tokens/primitives/modes/typography/size/small.json b/internal/design-tokens/primitives/modes/typography/size/small.json
index 99e67f561f..4ed462d883 100644
--- a/internal/design-tokens/primitives/modes/typography/size/small.json
+++ b/internal/design-tokens/primitives/modes/typography/size/small.json
@@ -1,96 +1,14 @@
 {
-  "line-height": {
-    "sm": {
-      "$type": "lineHeights",
-      "$value": "130%"
-    },
-    "md": {
-      "$type": "lineHeights",
-      "$value": "150%"
-    },
-    "lg": {
-      "$type": "lineHeights",
-      "$value": "170%"
-    }
-  },
-  "font-size": {
-    "1": {
-      "$type": "fontSizes",
-      "$value": "11"
-    },
-    "2": {
-      "$type": "fontSizes",
-      "$value": "13"
-    },
-    "3": {
-      "$type": "fontSizes",
-      "$value": "14"
-    },
-    "4": {
-      "$type": "fontSizes",
-      "$value": "16"
-    },
-    "5": {
-      "$type": "fontSizes",
-      "$value": "18"
-    },
-    "6": {
-      "$type": "fontSizes",
-      "$value": "21"
-    },
-    "7": {
-      "$type": "fontSizes",
-      "$value": "24"
-    },
-    "8": {
-      "$type": "fontSizes",
-      "$value": "30"
-    },
-    "9": {
-      "$type": "fontSizes",
-      "$value": "36"
-    },
-    "10": {
-      "$type": "fontSizes",
-      "$value": "48"
-    }
-  },
-  "letter-spacing": {
-    "1": {
-      "$type": "letterSpacing",
-      "$value": "-1%"
-    },
-    "2": {
-      "$type": "letterSpacing",
-      "$value": "-0.5%"
-    },
-    "3": {
-      "$type": "letterSpacing",
-      "$value": "-0.25%"
-    },
-    "4": {
-      "$type": "letterSpacing",
-      "$value": "-0.15%"
-    },
-    "5": {
-      "$type": "letterSpacing",
-      "$value": "0%"
-    },
-    "6": {
-      "$type": "letterSpacing",
-      "$value": "0.15%"
-    },
-    "7": {
-      "$type": "letterSpacing",
-      "$value": "0.25%"
-    },
-    "8": {
-      "$type": "letterSpacing",
-      "$value": "0.5%"
-    },
-    "9": {
-      "$type": "letterSpacing",
-      "$value": "1.5%"
+  "font-scale": {
+    "_base": {
+      "$type": "number",
+      "$value": "16",
+      "$description": "The font size (in px) to use as the basis for the scale. Is used as font-size.4."
+    },
+    "_ratio": {
+      "$type": "number",
+      "$value": "1.131",
+      "$description": "The ratio used to calculate each step in the scale. Must be larger than 1 (a ratio of 1 would make all font sizes the same, while a number between 0 and 1 effectively inverts the scale). Larger numbers result in a larger font-size.10 and a smaller font-size.1."
     }
   }
 }
\ No newline at end of file
diff --git a/packages/cli/src/tokens/create.ts b/packages/cli/src/tokens/create.ts
index f0bca5d9ad..a981c70d1a 100644
--- a/packages/cli/src/tokens/create.ts
+++ b/packages/cli/src/tokens/create.ts
@@ -33,10 +33,11 @@ export const createTokens = async (opts: Theme) => {
   const tokenSets: TokenSets = new Map([
     ...getDefaultTokens([
       'primitives/globals',
+      'primitives/modes/size/global',
       'primitives/modes/size/small',
       'primitives/modes/size/medium',
       'primitives/modes/size/large',
-      'primitives/modes/size/global',
+      'primitives/modes/typography/size/global',
       'primitives/modes/typography/size/small',
       'primitives/modes/typography/size/medium',
       'primitives/modes/typography/size/large',
diff --git a/packages/cli/src/tokens/create/defaults.ts b/packages/cli/src/tokens/create/defaults.ts
index bd29cfb533..ddc9eb8117 100644
--- a/packages/cli/src/tokens/create/defaults.ts
+++ b/packages/cli/src/tokens/create/defaults.ts
@@ -4,6 +4,9 @@ import sizeGlobal from '../template/design-tokens/primitives/modes/size/global.j
 import sizeLarge from '../template/design-tokens/primitives/modes/size/large.json' with { type: 'json' };
 import sizeMedium from '../template/design-tokens/primitives/modes/size/medium.json' with { type: 'json' };
 import sizeSmall from '../template/design-tokens/primitives/modes/size/small.json' with { type: 'json' };
+import typgraphyGlobal from '../template/design-tokens/primitives/modes/typography/size/global.json' with {
+  type: 'json',
+};
 import typgraphyLarge from '../template/design-tokens/primitives/modes/typography/size/large.json' with {
   type: 'json',
 };
@@ -18,10 +21,11 @@ import type { TokenSet } from '../types.js';
 
 const defaultTokens: Record<string, TokenSet> = {
   'primitives/globals': globals,
+  'primitives/modes/size/global': sizeGlobal,
   'primitives/modes/size/small': sizeSmall,
   'primitives/modes/size/medium': sizeMedium,
   'primitives/modes/size/large': sizeLarge,
-  'primitives/modes/size/global': sizeGlobal,
+  'primitives/modes/typography/size/global': typgraphyGlobal,
   'primitives/modes/typography/size/small': typgraphySmall,
   'primitives/modes/typography/size/medium': typgraphyMedium,
   'primitives/modes/typography/size/large': typgraphyLarge,
diff --git a/packages/cli/src/tokens/create/generators/$metadata.ts b/packages/cli/src/tokens/create/generators/$metadata.ts
index 3b9dca2286..8d808c5e2a 100644
--- a/packages/cli/src/tokens/create/generators/$metadata.ts
+++ b/packages/cli/src/tokens/create/generators/$metadata.ts
@@ -9,10 +9,11 @@ export function generate$Metadata(schemes: ColorScheme[], themes: string[], colo
   return {
     tokenSetOrder: [
       'primitives/globals',
+      'primitives/modes/size/global',
       'primitives/modes/size/small',
       'primitives/modes/size/medium',
       'primitives/modes/size/large',
-      'primitives/modes/size/global',
+      'primitives/modes/typography/size/global',
       'primitives/modes/typography/size/small',
       'primitives/modes/typography/size/medium',
       'primitives/modes/typography/size/large',
diff --git a/packages/cli/src/tokens/create/generators/$themes.ts b/packages/cli/src/tokens/create/generators/$themes.ts
index 36b852ea83..e0de12f8e1 100644
--- a/packages/cli/src/tokens/create/generators/$themes.ts
+++ b/packages/cli/src/tokens/create/generators/$themes.ts
@@ -45,7 +45,8 @@ function generateSizeGroup(): ThemeObject_[] {
       selectedTokenSets: {
         'primitives/modes/size/medium': TokenSetStatus.SOURCE,
         'primitives/modes/size/global': TokenSetStatus.ENABLED,
-        'primitives/modes/typography/size/medium': TokenSetStatus.ENABLED,
+        'primitives/modes/typography/size/medium': TokenSetStatus.SOURCE,
+        'primitives/modes/typography/size/global': TokenSetStatus.ENABLED,
       },
       $figmaCollectionId: 'VariableCollectionId:36248:20757',
       $figmaModeId: '41630:1',
@@ -58,7 +59,8 @@ function generateSizeGroup(): ThemeObject_[] {
       selectedTokenSets: {
         'primitives/modes/size/large': TokenSetStatus.SOURCE,
         'primitives/modes/size/global': TokenSetStatus.ENABLED,
-        'primitives/modes/typography/size/large': TokenSetStatus.ENABLED,
+        'primitives/modes/typography/size/large': TokenSetStatus.SOURCE,
+        'primitives/modes/typography/size/global': TokenSetStatus.ENABLED,
       },
       $figmaCollectionId: 'VariableCollectionId:36248:20757',
       $figmaModeId: '41630:2',
@@ -71,7 +73,8 @@ function generateSizeGroup(): ThemeObject_[] {
       selectedTokenSets: {
         'primitives/modes/size/small': TokenSetStatus.SOURCE,
         'primitives/modes/size/global': TokenSetStatus.ENABLED,
-        'primitives/modes/typography/size/small': TokenSetStatus.ENABLED,
+        'primitives/modes/typography/size/small': TokenSetStatus.SOURCE,
+        'primitives/modes/typography/size/global': TokenSetStatus.ENABLED,
       },
       $figmaCollectionId: 'VariableCollectionId:36248:20757',
       $figmaModeId: '41630:3',
diff --git a/packages/cli/src/tokens/process/configs/semantic.ts b/packages/cli/src/tokens/process/configs/semantic.ts
index 4b5aaad0a9..e2f0cc2eda 100644
--- a/packages/cli/src/tokens/process/configs/semantic.ts
+++ b/packages/cli/src/tokens/process/configs/semantic.ts
@@ -30,7 +30,7 @@ export const semanticVariables: GetStyleDictionaryConfig = ({ theme }) => {
               const isUwantedToken = R.anyPass([R.includes('primitives/global')])(token.filePath);
               const isPrivateToken = R.includes('_', token.path);
               const unwantedPaths = pathStartsWithOneOf(
-                ['size', '_size', 'font-size', 'line-height', 'letter-spacing'],
+                ['size', '_size', 'font-scale', 'font-size', 'line-height', 'letter-spacing'],
                 token,
               );
               const unwantedTypes = typeEquals(['color', 'fontWeight', 'fontFamily', 'typography'], token);
diff --git a/packages/cli/src/tokens/process/configs/size-mode.ts b/packages/cli/src/tokens/process/configs/size-mode.ts
index 66408a75a8..2f85732839 100644
--- a/packages/cli/src/tokens/process/configs/size-mode.ts
+++ b/packages/cli/src/tokens/process/configs/size-mode.ts
@@ -1,36 +1,39 @@
 import * as R from 'ramda';
+import { pathStartsWithOneOf } from '../../utils.js';
 import { formats } from '../formats/css.js';
-
 import { basePxFontSize, dsTransformers, type GetStyleDictionaryConfig, prefix } from './shared.js';
 
-export const sizeModeVariables: GetStyleDictionaryConfig = ({ theme, size }) => {
-  const selector = `:root`;
-  const layer = `ds.theme.size-mode`;
+export const sizeModeVariables =
+  (typeScaleValues: 'modular' | 'static'): GetStyleDictionaryConfig =>
+  ({ theme, size }) => {
+    const selector = `:root`;
+    const layer = `ds.theme.size-mode`;
 
-  return {
-    preprocessors: ['tokens-studio'],
-    platforms: {
-      css: {
-        // custom
-        size,
-        theme,
-        basePxFontSize,
-        selector,
-        layer,
-        //
-        prefix,
-        buildPath: `${theme}/`,
-        transforms: dsTransformers,
-        files: [
-          {
-            destination: `size-mode/${size}.css`,
-            format: formats.sizeMode.name,
-            filter: (token) => {
-              return R.equals(['_size', 'mode-font-size'], token.path);
+    return {
+      preprocessors: ['tokens-studio'],
+      platforms: {
+        css: {
+          // custom
+          size,
+          theme,
+          basePxFontSize,
+          selector,
+          layer,
+          typeScaleValues,
+          //
+          prefix,
+          buildPath: `${theme}/`,
+          transforms: dsTransformers,
+          files: [
+            {
+              destination: `size-mode/${size}.css`,
+              format: formats.sizeMode.name,
+              filter: (token) => {
+                return R.equals(['_size', 'mode-font-size'], token.path) || pathStartsWithOneOf(['font-scale'], token);
+              },
             },
-          },
-        ],
+          ],
+        },
       },
-    },
+    };
   };
-};
diff --git a/packages/cli/src/tokens/process/configs/type-scale.ts b/packages/cli/src/tokens/process/configs/type-scale.ts
index 1aae5805e5..8bdcff8259 100644
--- a/packages/cli/src/tokens/process/configs/type-scale.ts
+++ b/packages/cli/src/tokens/process/configs/type-scale.ts
@@ -3,53 +3,60 @@ import { formats } from '../formats/css.js';
 import { sizeRem, typographyName } from '../transformers.js';
 import { basePxFontSize, type GetStyleDictionaryConfig, prefix } from './shared.js';
 
-export const typeScaleVariables: GetStyleDictionaryConfig = ({ theme }) => {
-  const selector = ':root, [data-size]';
-  const layer = `ds.theme.type-scale`;
+export const typeScaleVariables =
+  (scaleValues: 'static' | 'modular'): GetStyleDictionaryConfig =>
+  ({ theme, size }) => {
+    if (scaleValues === 'static') {
+      console.log('typescalevariables: size =', size);
+    }
+    const selector = ':root';
+    const layer = `ds.theme.type-scale`;
 
-  return {
-    usesDtcg: true,
-    preprocessors: ['tokens-studio'],
-    expand: {
-      include: ['typography'],
-    },
-    platforms: {
-      css: {
-        prefix,
-        selector,
-        layer,
-        buildPath: `${theme}/`,
-        basePxFontSize,
-        transforms: [
-          'name/kebab',
-          'ts/size/px',
-          sizeRem.name,
-          'ts/size/lineheight',
-          'ts/typography/fontWeight',
-          typographyName.name,
-        ],
-        files: [
-          {
-            destination: `type-scale.css`,
-            format: formats.typeScale.name,
-            filter: (token) => {
-              const included = typeEquals(['typography', 'dimension', 'fontsize'], token);
+    return {
+      usesDtcg: true,
+      preprocessors: ['tokens-studio'],
+      expand: {
+        include: ['typography'],
+      },
+      platforms: {
+        css: {
+          size: scaleValues === 'static' ? size : undefined,
+          prefix,
+          selector,
+          layer,
+          buildPath: `${theme}/`,
+          basePxFontSize,
+          transforms: [
+            'name/kebab',
+            ...(scaleValues === 'static' ? ['ts/resolveMath'] : []),
+            'ts/size/px',
+            sizeRem.name,
+            'ts/size/lineheight',
+            'ts/typography/fontWeight',
+            typographyName.name,
+          ],
+          files: [
+            {
+              destination: scaleValues === 'static' ? `type-scale/${size}.css` : `type-scale.css`,
+              format: formats.typeScale.name,
+              filter: (token) => {
+                const included = typeEquals(['typography', 'dimension', 'fontsize', 'number'], token);
 
-              // Remove primitive typgography tokens
-              if (/primitives\/modes\/typography\/(primary|secondary)/.test(token.filePath)) return false;
+                // Remove primitive typgography tokens
+                if (/primitives\/modes\/typography\/(primary|secondary)/.test(token.filePath)) return false;
 
-              return (
-                included &&
-                !pathStartsWithOneOf(['spacing', 'sizing', 'size', 'border-width', 'border-radius'], token) &&
-                (pathStartsWithOneOf(['font-size'], token) || token.path.includes('fontSize'))
-              );
+                return (
+                  included &&
+                  !pathStartsWithOneOf(['spacing', 'sizing', 'size', 'border-width', 'border-radius'], token) &&
+                  (pathStartsWithOneOf(['font-size', 'font-scale'], token) || token.path.includes('fontSize'))
+                );
+              },
             },
+          ],
+          options: {
+            outputReferences: (token) => pathStartsWithOneOf(['typography'], token) && token.path.includes('fontSize'),
           },
-        ],
-        options: {
-          outputReferences: (token) => pathStartsWithOneOf(['typography'], token) && token.path.includes('fontSize'),
         },
       },
-    },
+    };
   };
-};
diff --git a/packages/cli/src/tokens/process/formats/css/size-mode.ts b/packages/cli/src/tokens/process/formats/css/size-mode.ts
index 14f827762f..040f8abd78 100644
--- a/packages/cli/src/tokens/process/formats/css/size-mode.ts
+++ b/packages/cli/src/tokens/process/formats/css/size-mode.ts
@@ -12,14 +12,19 @@ const formatBaseSizeToken =
     ...token,
     originalName: token.name,
     name: `${token.name}--${shortSizeName(size)}`,
-    $value: token.$value / basePxFontSize,
+    $value: token.path.includes('_ratio') ? token.$value : token.$value / basePxFontSize,
+    $description: undefined, // removes comment from output
   });
 
 export const sizeMode: Format = {
   name: 'ds/css-size-mode',
   format: async ({ dictionary, file, options, platform }) => {
     const { outputReferences, usesDtcg } = options;
-    const { selector, layer, size } = platform;
+    const { selector, layer, size } = platform as {
+      selector: string;
+      layer?: string;
+      size: string;
+    };
     const destination = file.destination as string;
 
     const format = createPropertyFormatter({
diff --git a/packages/cli/src/tokens/process/formats/css/size.ts b/packages/cli/src/tokens/process/formats/css/size.ts
index 490a167555..8298a54e38 100644
--- a/packages/cli/src/tokens/process/formats/css/size.ts
+++ b/packages/cli/src/tokens/process/formats/css/size.ts
@@ -19,7 +19,7 @@ export const isInlineTokens = R.anyPass([isNumericBorderRadiusToken, isNumericSi
  * @returns Object with formatted CSS strings for calc and round.
  */
 export const overrideSizingFormula = (format: (t: TransformedToken) => string, token: TransformedToken) => {
-  const [name, value] = format(token).replace(/;$/, '').split(': ');
+  const [name, value] = format(token).trim().replace(/;$/, '').split(': ');
 
   let calc: string;
   let round: string | undefined;
@@ -63,11 +63,15 @@ const formatSizingTokens = (format: (t: TransformedToken) => string, tokens: Tra
 
 export const sizingTemplate = ({ round, calc }: { round: string[]; calc: string[] }) => {
   const usesRounding = round.filter((val, i) => val !== calc[i]);
-  return `
-${calc.join('\n')}\n
+  const supportsRoundCss = usesRounding.length
+    ? `\n
   @supports (width: round(down, .1em, 1px)) {
-  ${usesRounding.join('\n  ')}
-  }`;
+    ${usesRounding.join('\n    ')}
+  }`
+    : '';
+
+  return `
+  ${calc.join('\n  ')}${supportsRoundCss}`;
 };
 
 export const size: Format = {
diff --git a/packages/cli/src/tokens/process/formats/css/type-scale.ts b/packages/cli/src/tokens/process/formats/css/type-scale.ts
index 91f042741b..1d0c090d8c 100644
--- a/packages/cli/src/tokens/process/formats/css/type-scale.ts
+++ b/packages/cli/src/tokens/process/formats/css/type-scale.ts
@@ -1,44 +1,73 @@
 import * as R from 'ramda';
-import type { Format, TransformedToken } from 'style-dictionary/types';
+import type { Dictionary, Format, TransformedToken } from 'style-dictionary/types';
 import { createPropertyFormatter } from 'style-dictionary/utils';
-import { basePxFontSize } from '../../configs/shared.js';
+import { orderBySize, shortSizeName } from '../../../utils.js';
 import { buildOptions } from '../../platform.js';
 import { sizingTemplate } from './size.js';
+import { wrapInLayer } from './size-mode.js';
 
 // Predicate to filter tokens with .path array that includes both typography and fontFamily
 const isTypographyFontFamilyToken = R.allPass([
   R.pathSatisfies(R.includes('typography'), ['path']),
   R.pathSatisfies(R.includes('fontFamily'), ['path']),
 ]);
+// Predicate to filter font-scale tokens
+const isFontScaleToken = R.pathSatisfies(R.includes('font-scale'), ['path']);
 
-type TokensWithCalcAndRoundFormatting = { tokens: TransformedToken[]; calc: string[]; round: string[] };
+type TokensWithCalcAndRoundFormatting = {
+  tokens: TransformedToken[];
+  calc: string[];
+  round: string[];
+  name: string[];
+  originalName: string[];
+};
 
 const formatTypographySizeToken = (
+  dictionary: Dictionary,
   format: (t: TransformedToken) => string,
   token: TransformedToken,
-): { name: string; calc: string; round: string } => {
-  const [name, value] = format(token).replace(/;$/, '').split(': ');
+  size?: string,
+): { name: string; originalName: string; calc: string; round: string } => {
+  const [originalName, value] = format(token).trim().replace(/;$/, '').split(': ');
+  // If we have a size, we're using static type scale values, and need to output the static values per mode.
+  const name =
+    size && R.startsWith(['font-size'], token.path) ? `${originalName}--${shortSizeName(size)}` : originalName;
+
   let calc: string;
   let round: string | undefined;
-  if (R.startsWith(['font-size'], token.path)) {
-    calc = `calc(${value} * var(--_ds-font-size-factor))`;
+  // If we don't have a size, it means we're using modular type scale values.
+  // That means we need to translate the Tokens Studio formulas to css.
+  if (!size && R.startsWith(['font-size'], token.path)) {
+    const originalWithCssReference = (token.original.$value as string).replaceAll(/\{font-scale\.[^}]+\}/g, (match) => {
+      const t = dictionary.unfilteredTokenMap?.get(match);
+      return `var(--${t?.name as string})`;
+    });
+    const cssCalcValue = originalWithCssReference.replace(/^roundTo\((.*), 0\)$/, '$1');
+    calc = `calc(1rem * ${cssCalcValue})`;
     round = `round(${calc}, 1px)`;
   } else {
     calc = value;
   }
-  return { name, calc, round: round ?? calc };
+  return { name, originalName, calc, round: round ?? calc };
 };
 
-const formatTypographySizeTokens = (format: (t: TransformedToken) => string, tokens: TransformedToken[]) =>
+const formatTypographySizeTokens = (
+  dictionary: Dictionary,
+  format: (t: TransformedToken) => string,
+  tokens: TransformedToken[],
+  size?: string,
+) =>
   R.reduce<TransformedToken, TokensWithCalcAndRoundFormatting>(
     (acc, token) => {
-      const { name, calc, round } = formatTypographySizeToken(format, token);
+      const { name, calc, round, originalName } = formatTypographySizeToken(dictionary, format, token, size);
       acc.tokens.push(token);
+      acc.name.push(name);
+      acc.originalName.push(originalName);
       acc.calc.push(`${name}: ${calc};`);
       acc.round.push(`${name}: ${round};`);
       return acc;
     },
-    { tokens: [], calc: [], round: [] },
+    { tokens: [], calc: [], round: [], name: [], originalName: [] },
     tokens,
   );
 
@@ -46,7 +75,7 @@ export const typeScale: Format = {
   name: 'ds/css-type-scale',
   format: async ({ dictionary, file, options, platform }) => {
     const { outputReferences, usesDtcg } = options;
-    const { selector, layer } = platform as { selector: string; layer: string };
+    const { selector, layer, size } = platform as { selector: string; layer?: string; size?: string };
     const destination = file.destination as string;
 
     const format = createPropertyFormatter({
@@ -56,20 +85,50 @@ export const typeScale: Format = {
       usesDtcg,
     });
 
-    const filteredTokens = R.reject(R.anyPass([isTypographyFontFamilyToken]), dictionary.allTokens);
-    const formattedTokens = formatTypographySizeTokens(format, filteredTokens);
+    const filteredTokens = R.reject(R.anyPass([isTypographyFontFamilyToken, isFontScaleToken]), dictionary.allTokens);
+    const [typeScaleTokens, restTokens] = R.partition((t) => R.startsWith(['font-size'], t.path), filteredTokens);
+    const formatted = formatTypographySizeTokens(dictionary, format, typeScaleTokens, size);
 
-    const formattedMap = formattedTokens.round.map((t, i) => ({
-      token: formattedTokens.tokens[i],
-      formatted: t,
+    const formattedMap = formatted.round.map((s, i) => ({
+      token: formatted.tokens[i],
+      // Remove the `--<size>` suffix for the token listing, since that is the only token we actually use
+      formatted: s.replace(formatted.name[i], formatted.originalName[i]),
     }));
 
     buildOptions.buildTokenFormats[destination] = formattedMap;
 
-    const sizeFactor = `  --_ds-font-size-factor: calc(var(--ds-size-mode-font-size) / (var(--ds-size-base) / ${basePxFontSize}));`;
-    const content = `${selector} {\n${sizeFactor}${sizingTemplate(formattedTokens)}\n}`;
-    const body = R.isNotNil(layer) ? `@layer ${layer} {\n${content}\n}` : content;
+    const optionalSizeComment = size ? ` /* ${size} */` : '';
+    const content = `${selector}${optionalSizeComment} {${sizingTemplate(formatted)}\n}`;
+    const body = wrapInLayer(content, layer);
+
+    /*
+     * The following CSS is only generated once, not per mode
+     */
+    const sizes = orderBySize(buildOptions?.sizeModes ?? []).map(shortSizeName);
+
+    const fontScaleToggles = size
+      ? formatted.originalName
+          .map(
+            (variable) => `  ${variable}:
+${sizes.map((size) => `    var(--ds-size--${size}, var(${variable}--${size}))`).join('\n')};`,
+          )
+          .join('\n')
+      : `  --ds-font-scale-base:
+${sizes.map((size) => `    var(--ds-size--${size}, var(--ds-font-scale-base--${size}))`).join('\n')};
+  --ds-font-scale-ratio:
+${sizes.map((size) => `    var(--ds-size--${size}, var(--ds-font-scale-ratio--${size}))`).join('\n')};`;
+
+    const referenceVariables = restTokens.map(format).join('\n');
+    const sharedContent = `:root, [data-size] {
+${fontScaleToggles}
+${referenceVariables}
+}`;
+
+    const sharedBody = !size || shortSizeName(size) === R.last(sizes) ? `\n${wrapInLayer(sharedContent, layer)}` : '';
+    /*
+     * End of generated-once CSS
+     */
 
-    return body;
+    return body + sharedBody;
   },
 };
diff --git a/packages/cli/src/tokens/process/output/theme.ts b/packages/cli/src/tokens/process/output/theme.ts
index a8406ebda3..d57cc4d32e 100644
--- a/packages/cli/src/tokens/process/output/theme.ts
+++ b/packages/cli/src/tokens/process/output/theme.ts
@@ -58,6 +58,7 @@ export const createThemeCSSFiles = ({
   const sortOrder = [
     'size-mode/',
     'type-scale',
+    'type-scale/',
     'color-scheme/light',
     'typography/secondary',
     'size',
diff --git a/packages/cli/src/tokens/process/platform.ts b/packages/cli/src/tokens/process/platform.ts
index 22ea78ace4..eda1774a72 100644
--- a/packages/cli/src/tokens/process/platform.ts
+++ b/packages/cli/src/tokens/process/platform.ts
@@ -81,9 +81,11 @@ const sd = new StyleDictionary();
  */
 const buildConfigs = {
   typography: { getConfig: configs.typographyVariables, dimensions: ['typography'] },
-  sizeMode: { getConfig: configs.sizeModeVariables, dimensions: ['size'] },
+  // sizeMode: { getConfig: configs.sizeModeVariables('modular'), dimensions: ['size'] },
+  sizeMode: { getConfig: configs.sizeModeVariables('static'), dimensions: ['size'] },
   size: { getConfig: configs.sizeVariables, dimensions: ['semantic'] },
-  typeScale: { getConfig: configs.typeScaleVariables, dimensions: ['semantic'] },
+  // typeScale: { getConfig: configs.typeScaleVariables('modular'), dimensions: ['semantic'] },
+  typeScale: { getConfig: configs.typeScaleVariables('static'), dimensions: ['semantic', 'size'] },
   'color-scheme': { getConfig: configs.colorSchemeVariables, dimensions: ['color-scheme'] },
   'main-color': { getConfig: configs.mainColorVariables, dimensions: ['main-color'] },
   'support-color': { getConfig: configs.supportColorVariables, dimensions: ['support-color'] },
diff --git a/packages/cli/src/tokens/template/design-tokens/primitives/modes/typography/size/global.json b/packages/cli/src/tokens/template/design-tokens/primitives/modes/typography/size/global.json
new file mode 100644
index 0000000000..a3dd5469ea
--- /dev/null
+++ b/packages/cli/src/tokens/template/design-tokens/primitives/modes/typography/size/global.json
@@ -0,0 +1,96 @@
+{
+  "line-height": {
+    "sm": {
+      "$type": "lineHeights",
+      "$value": "130%"
+    },
+    "md": {
+      "$type": "lineHeights",
+      "$value": "150%"
+    },
+    "lg": {
+      "$type": "lineHeights",
+      "$value": "170%"
+    }
+  },
+  "font-size": {
+    "1": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} / pow({font-scale._ratio}, 3), 0)"
+    },
+    "2": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} / pow({font-scale._ratio}, 2), 0)"
+    },
+    "3": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} / pow({font-scale._ratio}, 1), 0)"
+    },
+    "4": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} * pow({font-scale._ratio}, 0), 0)"
+    },
+    "5": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} * pow({font-scale._ratio}, 1), 0)"
+    },
+    "6": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} * pow({font-scale._ratio}, 2), 0)"
+    },
+    "7": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} * pow({font-scale._ratio}, 3), 0)"
+    },
+    "8": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} * pow({font-scale._ratio}, 5), 0)"
+    },
+    "9": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} * pow({font-scale._ratio}, 7), 0)"
+    },
+    "10": {
+      "$type": "fontSizes",
+      "$value": "roundTo({font-scale._base} * pow({font-scale._ratio}, 9), 0)"
+    }
+  },
+  "letter-spacing": {
+    "1": {
+      "$type": "letterSpacing",
+      "$value": "-1%"
+    },
+    "2": {
+      "$type": "letterSpacing",
+      "$value": "-0.5%"
+    },
+    "3": {
+      "$type": "letterSpacing",
+      "$value": "-0.25%"
+    },
+    "4": {
+      "$type": "letterSpacing",
+      "$value": "-0.15%"
+    },
+    "5": {
+      "$type": "letterSpacing",
+      "$value": "0%"
+    },
+    "6": {
+      "$type": "letterSpacing",
+      "$value": "0.15%"
+    },
+    "7": {
+      "$type": "letterSpacing",
+      "$value": "0.25%"
+    },
+    "8": {
+      "$type": "letterSpacing",
+      "$value": "0.5%"
+    },
+    "9": {
+      "$type": "letterSpacing",
+      "$value": "1.5%"
+    }
+  }
+}
\ No newline at end of file
diff --git a/packages/cli/src/tokens/template/design-tokens/primitives/modes/typography/size/large.json b/packages/cli/src/tokens/template/design-tokens/primitives/modes/typography/size/large.json
index 9d7ed9b3e6..d423e72542 100644
--- a/packages/cli/src/tokens/template/design-tokens/primitives/modes/typography/size/large.json
+++ b/packages/cli/src/tokens/template/design-tokens/primitives/modes/typography/size/large.json
@@ -1,96 +1,14 @@
 {
-  "line-height": {
-    "sm": {
-      "$type": "lineHeights",
-      "$value": "130%"
-    },
-    "md": {
-      "$type": "lineHeights",
-      "$value": "150%"
-    },
-    "lg": {
-      "$type": "lineHeights",
-      "$value": "170%"
-    }
-  },
-  "font-size": {
-    "1": {
-      "$type": "fontSizes",
-      "$value": "13"
-    },
-    "2": {
-      "$type": "fontSizes",
-      "$value": "16"
-    },
-    "3": {
-      "$type": "fontSizes",
-      "$value": "18"
-    },
-    "4": {
-      "$type": "fontSizes",
-      "$value": "21"
-    },
-    "5": {
-      "$type": "fontSizes",
-      "$value": "24"
-    },
-    "6": {
-      "$type": "fontSizes",
-      "$value": "30"
-    },
-    "7": {
-      "$type": "fontSizes",
-      "$value": "36"
-    },
-    "8": {
-      "$type": "fontSizes",
-      "$value": "48"
-    },
-    "9": {
-      "$type": "fontSizes",
-      "$value": "60"
-    },
-    "10": {
-      "$type": "fontSizes",
-      "$value": "72"
-    }
-  },
-  "letter-spacing": {
-    "1": {
-      "$type": "letterSpacing",
-      "$value": "-1%"
-    },
-    "2": {
-      "$type": "letterSpacing",
-      "$value": "-0.5%"
-    },
-    "3": {
-      "$type": "letterSpacing",
-      "$value": "-0.25%"
-    },
-    "4": {
-      "$type": "letterSpacing",
-      "$value": "-0.15%"
-    },
-    "5": {
-      "$type": "letterSpacing",
-      "$value": "0%"
-    },
-    "6": {
-      "$type": "letterSpacing",
-      "$value": "0.15%"
-    },
-    "7": {
-      "$type": "letterSpacing",
-      "$value": "0.25%"
-    },
-    "8": {
-      "$type": "letterSpacing",
-      "$value": "0.5%"
-    },
-    "9": {
-      "$type": "letterSpacing",
-      "$value": "1.5%"
+  "font-scale": {
+    "_base": {
+      "$type": "number",
+      "$value": "21",
+      "$description": "The font size (in px) to use as the basis for the scale. Is used as font-size.4."
+    },
+    "_ratio": {
+      "$type": "number",
+      "$value": "1.146",
+      "$description": "The ratio used to calculate each step in the scale. Must be larger than 1 (a ratio of 1 would make all font sizes the same, while a number between 0 and 1 effectively inverts the scale). Larger numbers result in a larger font-size.10 and a smaller font-size.1."
     }
   }
 }
\ No newline at end of file
diff --git a/packages/cli/src/tokens/template/design-tokens/primitives/modes/typography/size/medium.json b/packages/cli/src/tokens/template/design-tokens/primitives/modes/typography/size/medium.json
index f861fb854c..0131aa6148 100644
--- a/packages/cli/src/tokens/template/design-tokens/primitives/modes/typography/size/medium.json
+++ b/packages/cli/src/tokens/template/design-tokens/primitives/modes/typography/size/medium.json
@@ -1,96 +1,14 @@
 {
-  "line-height": {
-    "sm": {
-      "$type": "lineHeights",
-      "$value": "130%"
-    },
-    "md": {
-      "$type": "lineHeights",
-      "$value": "150%"
-    },
-    "lg": {
-      "$type": "lineHeights",
-      "$value": "170%"
-    }
-  },
-  "font-size": {
-    "1": {
-      "$type": "fontSizes",
-      "$value": "12"
-    },
-    "2": {
-      "$type": "fontSizes",
-      "$value": "14"
-    },
-    "3": {
-      "$type": "fontSizes",
-      "$value": "16"
-    },
-    "4": {
-      "$type": "fontSizes",
-      "$value": "18"
-    },
-    "5": {
-      "$type": "fontSizes",
-      "$value": "21"
-    },
-    "6": {
-      "$type": "fontSizes",
-      "$value": "24"
-    },
-    "7": {
-      "$type": "fontSizes",
-      "$value": "30"
-    },
-    "8": {
-      "$type": "fontSizes",
-      "$value": "36"
-    },
-    "9": {
-      "$type": "fontSizes",
-      "$value": "48"
-    },
-    "10": {
-      "$type": "fontSizes",
-      "$value": "60"
-    }
-  },
-  "letter-spacing": {
-    "1": {
-      "$type": "letterSpacing",
-      "$value": "-1%"
-    },
-    "2": {
-      "$type": "letterSpacing",
-      "$value": "-0.5%"
-    },
-    "3": {
-      "$type": "letterSpacing",
-      "$value": "-0.25%"
-    },
-    "4": {
-      "$type": "letterSpacing",
-      "$value": "-0.15%"
-    },
-    "5": {
-      "$type": "letterSpacing",
-      "$value": "0%"
-    },
-    "6": {
-      "$type": "letterSpacing",
-      "$value": "0.15%"
-    },
-    "7": {
-      "$type": "letterSpacing",
-      "$value": "0.25%"
-    },
-    "8": {
-      "$type": "letterSpacing",
-      "$value": "0.5%"
-    },
-    "9": {
-      "$type": "letterSpacing",
-      "$value": "1.5%"
+  "font-scale": {
+    "_base": {
+      "$type": "number",
+      "$value": "18",
+      "$description": "The font size (in px) to use as the basis for the scale. Is used as font-size.4."
+    },
+    "_ratio": {
+      "$type": "number",
+      "$value": "1.143",
+      "$description": "The ratio used to calculate each step in the scale. Must be larger than 1 (a ratio of 1 would make all font sizes the same, while a number between 0 and 1 effectively inverts the scale). Larger numbers result in a larger font-size.10 and a smaller font-size.1."
     }
   }
 }
\ No newline at end of file
diff --git a/packages/cli/src/tokens/template/design-tokens/primitives/modes/typography/size/small.json b/packages/cli/src/tokens/template/design-tokens/primitives/modes/typography/size/small.json
index 99e67f561f..4ed462d883 100644
--- a/packages/cli/src/tokens/template/design-tokens/primitives/modes/typography/size/small.json
+++ b/packages/cli/src/tokens/template/design-tokens/primitives/modes/typography/size/small.json
@@ -1,96 +1,14 @@
 {
-  "line-height": {
-    "sm": {
-      "$type": "lineHeights",
-      "$value": "130%"
-    },
-    "md": {
-      "$type": "lineHeights",
-      "$value": "150%"
-    },
-    "lg": {
-      "$type": "lineHeights",
-      "$value": "170%"
-    }
-  },
-  "font-size": {
-    "1": {
-      "$type": "fontSizes",
-      "$value": "11"
-    },
-    "2": {
-      "$type": "fontSizes",
-      "$value": "13"
-    },
-    "3": {
-      "$type": "fontSizes",
-      "$value": "14"
-    },
-    "4": {
-      "$type": "fontSizes",
-      "$value": "16"
-    },
-    "5": {
-      "$type": "fontSizes",
-      "$value": "18"
-    },
-    "6": {
-      "$type": "fontSizes",
-      "$value": "21"
-    },
-    "7": {
-      "$type": "fontSizes",
-      "$value": "24"
-    },
-    "8": {
-      "$type": "fontSizes",
-      "$value": "30"
-    },
-    "9": {
-      "$type": "fontSizes",
-      "$value": "36"
-    },
-    "10": {
-      "$type": "fontSizes",
-      "$value": "48"
-    }
-  },
-  "letter-spacing": {
-    "1": {
-      "$type": "letterSpacing",
-      "$value": "-1%"
-    },
-    "2": {
-      "$type": "letterSpacing",
-      "$value": "-0.5%"
-    },
-    "3": {
-      "$type": "letterSpacing",
-      "$value": "-0.25%"
-    },
-    "4": {
-      "$type": "letterSpacing",
-      "$value": "-0.15%"
-    },
-    "5": {
-      "$type": "letterSpacing",
-      "$value": "0%"
-    },
-    "6": {
-      "$type": "letterSpacing",
-      "$value": "0.15%"
-    },
-    "7": {
-      "$type": "letterSpacing",
-      "$value": "0.25%"
-    },
-    "8": {
-      "$type": "letterSpacing",
-      "$value": "0.5%"
-    },
-    "9": {
-      "$type": "letterSpacing",
-      "$value": "1.5%"
+  "font-scale": {
+    "_base": {
+      "$type": "number",
+      "$value": "16",
+      "$description": "The font size (in px) to use as the basis for the scale. Is used as font-size.4."
+    },
+    "_ratio": {
+      "$type": "number",
+      "$value": "1.131",
+      "$description": "The ratio used to calculate each step in the scale. Must be larger than 1 (a ratio of 1 would make all font sizes the same, while a number between 0 and 1 effectively inverts the scale). Larger numbers result in a larger font-size.10 and a smaller font-size.1."
     }
   }
 }
\ No newline at end of file
diff --git a/packages/css/src/data-size-workaround.css b/packages/css/src/data-size-workaround.css
index 418dbb114f..204d4daa1c 100644
--- a/packages/css/src/data-size-workaround.css
+++ b/packages/css/src/data-size-workaround.css
@@ -10,8 +10,12 @@ the component to scale based on the surrounding data-size.
 /* Hack: Preserve --ds-size-mode-font-size on ancestor so we can look it up at the descendant */
 [data-size]:not(.ds-avatar, .ds-heading, .ds-paragraph, .ds-spinner) {
   --_ds-size-mode__hack: var(--ds-size-mode-font-size);
+  --_ds-font-scale-base__hack: var(--ds-font-scale-base);
+  --_ds-font-scale-ratio__hack: var(--ds-font-scale-ratio);
 }
 /* Hack: use the nearest ancestor size mode */
 [data-size] :is(.ds-avatar, .ds-heading, .ds-paragraph, .ds-spinner) {
   --ds-size-mode-font-size: var(--_ds-size-mode__hack);
+  --ds-font-scale-base: var(--_ds-font-scale-base__hack);
+  --ds-font-scale-ratio: var(--_ds-font-scale-ratio__hack);
 }
diff --git a/packages/theme/brand/altinn.css b/packages/theme/brand/altinn.css
index c1835c0a2f..a4beb2b654 100644
--- a/packages/theme/brand/altinn.css
+++ b/packages/theme/brand/altinn.css
@@ -7,18 +7,24 @@ design-tokens: v1.5.1
 @layer ds.theme.size-mode {
 :root /* small */ {
   --ds-size-mode-font-size--sm: 1;
+  --ds-font-scale-base--sm: 1;
+  --ds-font-scale-ratio--sm: 1.131;
 }
 }
 
 @layer ds.theme.size-mode {
 :root /* medium */ {
   --ds-size-mode-font-size--md: 1.125;
+  --ds-font-scale-base--md: 1.125;
+  --ds-font-scale-ratio--md: 1.143;
 }
 }
 
 @layer ds.theme.size-mode {
 :root /* large */ {
   --ds-size-mode-font-size--lg: 1.3125;
+  --ds-font-scale-base--lg: 1.3125;
+  --ds-font-scale-ratio--lg: 1.146;
 }
 }
 
@@ -32,6 +38,14 @@ design-tokens: v1.5.1
     var(--ds-size--sm, var(--ds-size-mode-font-size--sm))
     var(--ds-size--md, var(--ds-size-mode-font-size--md))
     var(--ds-size--lg, var(--ds-size-mode-font-size--lg));
+  --ds-font-scale-base:
+    var(--ds-size--sm, var(--ds-font-scale-base--sm))
+    var(--ds-size--md, var(--ds-font-scale-base--md))
+    var(--ds-size--lg, var(--ds-font-scale-base--lg));
+  --ds-font-scale-ratio:
+    var(--ds-size--sm, var(--ds-font-scale-ratio--sm))
+    var(--ds-size--md, var(--ds-font-scale-ratio--md))
+    var(--ds-size--lg, var(--ds-font-scale-ratio--lg));
 }
 
 [data-size='sm'] { --ds-size: var(--ds-size--sm); }
@@ -41,17 +55,16 @@ design-tokens: v1.5.1
 
 @layer ds.theme.type-scale {
 :root, [data-size] {
-  --_ds-font-size-factor: calc(var(--ds-size-mode-font-size) / (var(--ds-size-base) / 16));
-  --ds-font-size-1: calc(0.75rem * var(--_ds-font-size-factor));
-  --ds-font-size-2: calc(0.875rem * var(--_ds-font-size-factor));
-  --ds-font-size-3: calc(1rem * var(--_ds-font-size-factor));
-  --ds-font-size-4: calc(1.125rem * var(--_ds-font-size-factor));
-  --ds-font-size-5: calc(1.3125rem * var(--_ds-font-size-factor));
-  --ds-font-size-6: calc(1.5rem * var(--_ds-font-size-factor));
-  --ds-font-size-7: calc(1.875rem * var(--_ds-font-size-factor));
-  --ds-font-size-8: calc(2.25rem * var(--_ds-font-size-factor));
-  --ds-font-size-9: calc(3rem * var(--_ds-font-size-factor));
-  --ds-font-size-10: calc(3.75rem * var(--_ds-font-size-factor));
+  --ds-font-size-1: calc(1rem * var(--ds-font-scale-base) / pow(var(--ds-font-scale-ratio), 3));
+  --ds-font-size-2: calc(1rem * var(--ds-font-scale-base) / pow(var(--ds-font-scale-ratio), 2));
+  --ds-font-size-3: calc(1rem * var(--ds-font-scale-base) / pow(var(--ds-font-scale-ratio), 1));
+  --ds-font-size-4: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 0));
+  --ds-font-size-5: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 1));
+  --ds-font-size-6: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 2));
+  --ds-font-size-7: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 3));
+  --ds-font-size-8: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 5));
+  --ds-font-size-9: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 7));
+  --ds-font-size-10: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 9));
   --ds-heading-2xl-font-size: var(--ds-font-size-10);
   --ds-heading-xl-font-size: var(--ds-font-size-9);
   --ds-heading-lg-font-size: var(--ds-font-size-8);
@@ -76,16 +89,16 @@ design-tokens: v1.5.1
   --ds-body-long-xs-font-size: var(--ds-font-size-2);
 
   @supports (width: round(down, .1em, 1px)) {
-    --ds-font-size-1: round(calc(0.75rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-2: round(calc(0.875rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-3: round(calc(1rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-4: round(calc(1.125rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-5: round(calc(1.3125rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-6: round(calc(1.5rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-7: round(calc(1.875rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-8: round(calc(2.25rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-9: round(calc(3rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-10: round(calc(3.75rem * var(--_ds-font-size-factor)), 1px);
+    --ds-font-size-1: round(calc(1rem * var(--ds-font-scale-base) / pow(var(--ds-font-scale-ratio), 3)), 1px);
+    --ds-font-size-2: round(calc(1rem * var(--ds-font-scale-base) / pow(var(--ds-font-scale-ratio), 2)), 1px);
+    --ds-font-size-3: round(calc(1rem * var(--ds-font-scale-base) / pow(var(--ds-font-scale-ratio), 1)), 1px);
+    --ds-font-size-4: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 0)), 1px);
+    --ds-font-size-5: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 1)), 1px);
+    --ds-font-size-6: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 2)), 1px);
+    --ds-font-size-7: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 3)), 1px);
+    --ds-font-size-8: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 5)), 1px);
+    --ds-font-size-9: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 7)), 1px);
+    --ds-font-size-10: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 9)), 1px);
   }
 }
 }
diff --git a/packages/theme/brand/digdir.css b/packages/theme/brand/digdir.css
index 648eb41ef8..54662059c7 100644
--- a/packages/theme/brand/digdir.css
+++ b/packages/theme/brand/digdir.css
@@ -7,18 +7,24 @@ design-tokens: v1.5.1
 @layer ds.theme.size-mode {
 :root /* small */ {
   --ds-size-mode-font-size--sm: 1;
+  --ds-font-scale-base--sm: 1;
+  --ds-font-scale-ratio--sm: 1.131;
 }
 }
 
 @layer ds.theme.size-mode {
 :root /* medium */ {
   --ds-size-mode-font-size--md: 1.125;
+  --ds-font-scale-base--md: 1.125;
+  --ds-font-scale-ratio--md: 1.143;
 }
 }
 
 @layer ds.theme.size-mode {
 :root /* large */ {
   --ds-size-mode-font-size--lg: 1.3125;
+  --ds-font-scale-base--lg: 1.3125;
+  --ds-font-scale-ratio--lg: 1.146;
 }
 }
 
@@ -32,6 +38,14 @@ design-tokens: v1.5.1
     var(--ds-size--sm, var(--ds-size-mode-font-size--sm))
     var(--ds-size--md, var(--ds-size-mode-font-size--md))
     var(--ds-size--lg, var(--ds-size-mode-font-size--lg));
+  --ds-font-scale-base:
+    var(--ds-size--sm, var(--ds-font-scale-base--sm))
+    var(--ds-size--md, var(--ds-font-scale-base--md))
+    var(--ds-size--lg, var(--ds-font-scale-base--lg));
+  --ds-font-scale-ratio:
+    var(--ds-size--sm, var(--ds-font-scale-ratio--sm))
+    var(--ds-size--md, var(--ds-font-scale-ratio--md))
+    var(--ds-size--lg, var(--ds-font-scale-ratio--lg));
 }
 
 [data-size='sm'] { --ds-size: var(--ds-size--sm); }
@@ -41,17 +55,16 @@ design-tokens: v1.5.1
 
 @layer ds.theme.type-scale {
 :root, [data-size] {
-  --_ds-font-size-factor: calc(var(--ds-size-mode-font-size) / (var(--ds-size-base) / 16));
-  --ds-font-size-1: calc(0.75rem * var(--_ds-font-size-factor));
-  --ds-font-size-2: calc(0.875rem * var(--_ds-font-size-factor));
-  --ds-font-size-3: calc(1rem * var(--_ds-font-size-factor));
-  --ds-font-size-4: calc(1.125rem * var(--_ds-font-size-factor));
-  --ds-font-size-5: calc(1.3125rem * var(--_ds-font-size-factor));
-  --ds-font-size-6: calc(1.5rem * var(--_ds-font-size-factor));
-  --ds-font-size-7: calc(1.875rem * var(--_ds-font-size-factor));
-  --ds-font-size-8: calc(2.25rem * var(--_ds-font-size-factor));
-  --ds-font-size-9: calc(3rem * var(--_ds-font-size-factor));
-  --ds-font-size-10: calc(3.75rem * var(--_ds-font-size-factor));
+  --ds-font-size-1: calc(1rem * var(--ds-font-scale-base) / pow(var(--ds-font-scale-ratio), 3));
+  --ds-font-size-2: calc(1rem * var(--ds-font-scale-base) / pow(var(--ds-font-scale-ratio), 2));
+  --ds-font-size-3: calc(1rem * var(--ds-font-scale-base) / pow(var(--ds-font-scale-ratio), 1));
+  --ds-font-size-4: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 0));
+  --ds-font-size-5: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 1));
+  --ds-font-size-6: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 2));
+  --ds-font-size-7: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 3));
+  --ds-font-size-8: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 5));
+  --ds-font-size-9: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 7));
+  --ds-font-size-10: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 9));
   --ds-heading-2xl-font-size: var(--ds-font-size-10);
   --ds-heading-xl-font-size: var(--ds-font-size-9);
   --ds-heading-lg-font-size: var(--ds-font-size-8);
@@ -76,16 +89,16 @@ design-tokens: v1.5.1
   --ds-body-long-xs-font-size: var(--ds-font-size-2);
 
   @supports (width: round(down, .1em, 1px)) {
-    --ds-font-size-1: round(calc(0.75rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-2: round(calc(0.875rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-3: round(calc(1rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-4: round(calc(1.125rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-5: round(calc(1.3125rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-6: round(calc(1.5rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-7: round(calc(1.875rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-8: round(calc(2.25rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-9: round(calc(3rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-10: round(calc(3.75rem * var(--_ds-font-size-factor)), 1px);
+    --ds-font-size-1: round(calc(1rem * var(--ds-font-scale-base) / pow(var(--ds-font-scale-ratio), 3)), 1px);
+    --ds-font-size-2: round(calc(1rem * var(--ds-font-scale-base) / pow(var(--ds-font-scale-ratio), 2)), 1px);
+    --ds-font-size-3: round(calc(1rem * var(--ds-font-scale-base) / pow(var(--ds-font-scale-ratio), 1)), 1px);
+    --ds-font-size-4: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 0)), 1px);
+    --ds-font-size-5: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 1)), 1px);
+    --ds-font-size-6: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 2)), 1px);
+    --ds-font-size-7: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 3)), 1px);
+    --ds-font-size-8: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 5)), 1px);
+    --ds-font-size-9: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 7)), 1px);
+    --ds-font-size-10: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 9)), 1px);
   }
 }
 }
diff --git a/packages/theme/brand/portal.css b/packages/theme/brand/portal.css
index 099c0d9633..719e1125b1 100644
--- a/packages/theme/brand/portal.css
+++ b/packages/theme/brand/portal.css
@@ -7,18 +7,24 @@ design-tokens: v1.5.1
 @layer ds.theme.size-mode {
 :root /* small */ {
   --ds-size-mode-font-size--sm: 1;
+  --ds-font-scale-base--sm: 1;
+  --ds-font-scale-ratio--sm: 1.131;
 }
 }
 
 @layer ds.theme.size-mode {
 :root /* medium */ {
   --ds-size-mode-font-size--md: 1.125;
+  --ds-font-scale-base--md: 1.125;
+  --ds-font-scale-ratio--md: 1.143;
 }
 }
 
 @layer ds.theme.size-mode {
 :root /* large */ {
   --ds-size-mode-font-size--lg: 1.3125;
+  --ds-font-scale-base--lg: 1.3125;
+  --ds-font-scale-ratio--lg: 1.146;
 }
 }
 
@@ -32,6 +38,14 @@ design-tokens: v1.5.1
     var(--ds-size--sm, var(--ds-size-mode-font-size--sm))
     var(--ds-size--md, var(--ds-size-mode-font-size--md))
     var(--ds-size--lg, var(--ds-size-mode-font-size--lg));
+  --ds-font-scale-base:
+    var(--ds-size--sm, var(--ds-font-scale-base--sm))
+    var(--ds-size--md, var(--ds-font-scale-base--md))
+    var(--ds-size--lg, var(--ds-font-scale-base--lg));
+  --ds-font-scale-ratio:
+    var(--ds-size--sm, var(--ds-font-scale-ratio--sm))
+    var(--ds-size--md, var(--ds-font-scale-ratio--md))
+    var(--ds-size--lg, var(--ds-font-scale-ratio--lg));
 }
 
 [data-size='sm'] { --ds-size: var(--ds-size--sm); }
@@ -41,17 +55,16 @@ design-tokens: v1.5.1
 
 @layer ds.theme.type-scale {
 :root, [data-size] {
-  --_ds-font-size-factor: calc(var(--ds-size-mode-font-size) / (var(--ds-size-base) / 16));
-  --ds-font-size-1: calc(0.75rem * var(--_ds-font-size-factor));
-  --ds-font-size-2: calc(0.875rem * var(--_ds-font-size-factor));
-  --ds-font-size-3: calc(1rem * var(--_ds-font-size-factor));
-  --ds-font-size-4: calc(1.125rem * var(--_ds-font-size-factor));
-  --ds-font-size-5: calc(1.3125rem * var(--_ds-font-size-factor));
-  --ds-font-size-6: calc(1.5rem * var(--_ds-font-size-factor));
-  --ds-font-size-7: calc(1.875rem * var(--_ds-font-size-factor));
-  --ds-font-size-8: calc(2.25rem * var(--_ds-font-size-factor));
-  --ds-font-size-9: calc(3rem * var(--_ds-font-size-factor));
-  --ds-font-size-10: calc(3.75rem * var(--_ds-font-size-factor));
+  --ds-font-size-1: calc(1rem * var(--ds-font-scale-base) / pow(var(--ds-font-scale-ratio), 3));
+  --ds-font-size-2: calc(1rem * var(--ds-font-scale-base) / pow(var(--ds-font-scale-ratio), 2));
+  --ds-font-size-3: calc(1rem * var(--ds-font-scale-base) / pow(var(--ds-font-scale-ratio), 1));
+  --ds-font-size-4: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 0));
+  --ds-font-size-5: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 1));
+  --ds-font-size-6: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 2));
+  --ds-font-size-7: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 3));
+  --ds-font-size-8: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 5));
+  --ds-font-size-9: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 7));
+  --ds-font-size-10: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 9));
   --ds-heading-2xl-font-size: var(--ds-font-size-10);
   --ds-heading-xl-font-size: var(--ds-font-size-9);
   --ds-heading-lg-font-size: var(--ds-font-size-8);
@@ -76,16 +89,16 @@ design-tokens: v1.5.1
   --ds-body-long-xs-font-size: var(--ds-font-size-2);
 
   @supports (width: round(down, .1em, 1px)) {
-    --ds-font-size-1: round(calc(0.75rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-2: round(calc(0.875rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-3: round(calc(1rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-4: round(calc(1.125rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-5: round(calc(1.3125rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-6: round(calc(1.5rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-7: round(calc(1.875rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-8: round(calc(2.25rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-9: round(calc(3rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-10: round(calc(3.75rem * var(--_ds-font-size-factor)), 1px);
+    --ds-font-size-1: round(calc(1rem * var(--ds-font-scale-base) / pow(var(--ds-font-scale-ratio), 3)), 1px);
+    --ds-font-size-2: round(calc(1rem * var(--ds-font-scale-base) / pow(var(--ds-font-scale-ratio), 2)), 1px);
+    --ds-font-size-3: round(calc(1rem * var(--ds-font-scale-base) / pow(var(--ds-font-scale-ratio), 1)), 1px);
+    --ds-font-size-4: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 0)), 1px);
+    --ds-font-size-5: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 1)), 1px);
+    --ds-font-size-6: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 2)), 1px);
+    --ds-font-size-7: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 3)), 1px);
+    --ds-font-size-8: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 5)), 1px);
+    --ds-font-size-9: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 7)), 1px);
+    --ds-font-size-10: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 9)), 1px);
   }
 }
 }
diff --git a/packages/theme/brand/uutilsynet.css b/packages/theme/brand/uutilsynet.css
index 07fd133e37..00df0a5ade 100644
--- a/packages/theme/brand/uutilsynet.css
+++ b/packages/theme/brand/uutilsynet.css
@@ -7,18 +7,24 @@ design-tokens: v1.5.1
 @layer ds.theme.size-mode {
 :root /* small */ {
   --ds-size-mode-font-size--sm: 1;
+  --ds-font-scale-base--sm: 1;
+  --ds-font-scale-ratio--sm: 1.131;
 }
 }
 
 @layer ds.theme.size-mode {
 :root /* medium */ {
   --ds-size-mode-font-size--md: 1.125;
+  --ds-font-scale-base--md: 1.125;
+  --ds-font-scale-ratio--md: 1.143;
 }
 }
 
 @layer ds.theme.size-mode {
 :root /* large */ {
   --ds-size-mode-font-size--lg: 1.3125;
+  --ds-font-scale-base--lg: 1.3125;
+  --ds-font-scale-ratio--lg: 1.146;
 }
 }
 
@@ -32,6 +38,14 @@ design-tokens: v1.5.1
     var(--ds-size--sm, var(--ds-size-mode-font-size--sm))
     var(--ds-size--md, var(--ds-size-mode-font-size--md))
     var(--ds-size--lg, var(--ds-size-mode-font-size--lg));
+  --ds-font-scale-base:
+    var(--ds-size--sm, var(--ds-font-scale-base--sm))
+    var(--ds-size--md, var(--ds-font-scale-base--md))
+    var(--ds-size--lg, var(--ds-font-scale-base--lg));
+  --ds-font-scale-ratio:
+    var(--ds-size--sm, var(--ds-font-scale-ratio--sm))
+    var(--ds-size--md, var(--ds-font-scale-ratio--md))
+    var(--ds-size--lg, var(--ds-font-scale-ratio--lg));
 }
 
 [data-size='sm'] { --ds-size: var(--ds-size--sm); }
@@ -41,17 +55,16 @@ design-tokens: v1.5.1
 
 @layer ds.theme.type-scale {
 :root, [data-size] {
-  --_ds-font-size-factor: calc(var(--ds-size-mode-font-size) / (var(--ds-size-base) / 16));
-  --ds-font-size-1: calc(0.75rem * var(--_ds-font-size-factor));
-  --ds-font-size-2: calc(0.875rem * var(--_ds-font-size-factor));
-  --ds-font-size-3: calc(1rem * var(--_ds-font-size-factor));
-  --ds-font-size-4: calc(1.125rem * var(--_ds-font-size-factor));
-  --ds-font-size-5: calc(1.3125rem * var(--_ds-font-size-factor));
-  --ds-font-size-6: calc(1.5rem * var(--_ds-font-size-factor));
-  --ds-font-size-7: calc(1.875rem * var(--_ds-font-size-factor));
-  --ds-font-size-8: calc(2.25rem * var(--_ds-font-size-factor));
-  --ds-font-size-9: calc(3rem * var(--_ds-font-size-factor));
-  --ds-font-size-10: calc(3.75rem * var(--_ds-font-size-factor));
+  --ds-font-size-1: calc(1rem * var(--ds-font-scale-base) / pow(var(--ds-font-scale-ratio), 3));
+  --ds-font-size-2: calc(1rem * var(--ds-font-scale-base) / pow(var(--ds-font-scale-ratio), 2));
+  --ds-font-size-3: calc(1rem * var(--ds-font-scale-base) / pow(var(--ds-font-scale-ratio), 1));
+  --ds-font-size-4: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 0));
+  --ds-font-size-5: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 1));
+  --ds-font-size-6: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 2));
+  --ds-font-size-7: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 3));
+  --ds-font-size-8: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 5));
+  --ds-font-size-9: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 7));
+  --ds-font-size-10: calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 9));
   --ds-heading-2xl-font-size: var(--ds-font-size-10);
   --ds-heading-xl-font-size: var(--ds-font-size-9);
   --ds-heading-lg-font-size: var(--ds-font-size-8);
@@ -76,16 +89,16 @@ design-tokens: v1.5.1
   --ds-body-long-xs-font-size: var(--ds-font-size-2);
 
   @supports (width: round(down, .1em, 1px)) {
-    --ds-font-size-1: round(calc(0.75rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-2: round(calc(0.875rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-3: round(calc(1rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-4: round(calc(1.125rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-5: round(calc(1.3125rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-6: round(calc(1.5rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-7: round(calc(1.875rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-8: round(calc(2.25rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-9: round(calc(3rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-10: round(calc(3.75rem * var(--_ds-font-size-factor)), 1px);
+    --ds-font-size-1: round(calc(1rem * var(--ds-font-scale-base) / pow(var(--ds-font-scale-ratio), 3)), 1px);
+    --ds-font-size-2: round(calc(1rem * var(--ds-font-scale-base) / pow(var(--ds-font-scale-ratio), 2)), 1px);
+    --ds-font-size-3: round(calc(1rem * var(--ds-font-scale-base) / pow(var(--ds-font-scale-ratio), 1)), 1px);
+    --ds-font-size-4: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 0)), 1px);
+    --ds-font-size-5: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 1)), 1px);
+    --ds-font-size-6: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 2)), 1px);
+    --ds-font-size-7: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 3)), 1px);
+    --ds-font-size-8: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 5)), 1px);
+    --ds-font-size-9: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 7)), 1px);
+    --ds-font-size-10: round(calc(1rem * var(--ds-font-scale-base) * pow(var(--ds-font-scale-ratio), 9)), 1px);
   }
 }
 }
diff --git a/packages/theme/src/themes/designsystemet.css b/packages/theme/src/themes/designsystemet.css
index 81dfcf4075..56fe98040c 100644
--- a/packages/theme/src/themes/designsystemet.css
+++ b/packages/theme/src/themes/designsystemet.css
@@ -6,18 +6,24 @@ design-tokens: v1.5.1
 
 @layer ds.theme.size-mode {
 :root /* small */ {
+  --ds-font-scale-base--sm: 1;
+  --ds-font-scale-ratio--sm: 1.131;
   --ds-size-mode-font-size--sm: 1;
 }
 }
 
 @layer ds.theme.size-mode {
 :root /* medium */ {
+  --ds-font-scale-base--md: 1.125;
+  --ds-font-scale-ratio--md: 1.143;
   --ds-size-mode-font-size--md: 1.125;
 }
 }
 
 @layer ds.theme.size-mode {
 :root /* large */ {
+  --ds-font-scale-base--lg: 1.3125;
+  --ds-font-scale-ratio--lg: 1.146;
   --ds-size-mode-font-size--lg: 1.3125;
 }
 }
@@ -39,19 +45,93 @@ design-tokens: v1.5.1
 [data-size='lg'] { --ds-size: var(--ds-size--lg); }
 }
 
+@layer ds.theme.type-scale {
+:root /* small */ {
+  --ds-font-size-1--sm: 0.6875rem;
+  --ds-font-size-2--sm: 0.8125rem;
+  --ds-font-size-3--sm: 0.875rem;
+  --ds-font-size-4--sm: 1rem;
+  --ds-font-size-5--sm: 1.125rem;
+  --ds-font-size-6--sm: 1.25rem;
+  --ds-font-size-7--sm: 1.4375rem;
+  --ds-font-size-8--sm: 1.875rem;
+  --ds-font-size-9--sm: 2.375rem;
+  --ds-font-size-10--sm: 3rem;
+}
+}
+
+@layer ds.theme.type-scale {
+:root /* medium */ {
+  --ds-font-size-1--md: 0.75rem;
+  --ds-font-size-2--md: 0.875rem;
+  --ds-font-size-3--md: 1rem;
+  --ds-font-size-4--md: 1.125rem;
+  --ds-font-size-5--md: 1.3125rem;
+  --ds-font-size-6--md: 1.5rem;
+  --ds-font-size-7--md: 1.6875rem;
+  --ds-font-size-8--md: 2.1875rem;
+  --ds-font-size-9--md: 2.875rem;
+  --ds-font-size-10--md: 3.75rem;
+}
+}
+
+@layer ds.theme.type-scale {
+:root /* large */ {
+  --ds-font-size-1--lg: 0.875rem;
+  --ds-font-size-2--lg: 1rem;
+  --ds-font-size-3--lg: 1.125rem;
+  --ds-font-size-4--lg: 1.3125rem;
+  --ds-font-size-5--lg: 1.5rem;
+  --ds-font-size-6--lg: 1.75rem;
+  --ds-font-size-7--lg: 2rem;
+  --ds-font-size-8--lg: 2.625rem;
+  --ds-font-size-9--lg: 3.4375rem;
+  --ds-font-size-10--lg: 4.5rem;
+}
+}
+
 @layer ds.theme.type-scale {
 :root, [data-size] {
-  --_ds-font-size-factor: calc(var(--ds-size-mode-font-size) / (var(--ds-size-base) / 16));
-  --ds-font-size-1: calc(0.75rem * var(--_ds-font-size-factor));
-  --ds-font-size-2: calc(0.875rem * var(--_ds-font-size-factor));
-  --ds-font-size-3: calc(1rem * var(--_ds-font-size-factor));
-  --ds-font-size-4: calc(1.125rem * var(--_ds-font-size-factor));
-  --ds-font-size-5: calc(1.3125rem * var(--_ds-font-size-factor));
-  --ds-font-size-6: calc(1.5rem * var(--_ds-font-size-factor));
-  --ds-font-size-7: calc(1.875rem * var(--_ds-font-size-factor));
-  --ds-font-size-8: calc(2.25rem * var(--_ds-font-size-factor));
-  --ds-font-size-9: calc(3rem * var(--_ds-font-size-factor));
-  --ds-font-size-10: calc(3.75rem * var(--_ds-font-size-factor));
+  --ds-font-size-1:
+    var(--ds-size--sm, var(--ds-font-size-1--sm))
+    var(--ds-size--md, var(--ds-font-size-1--md))
+    var(--ds-size--lg, var(--ds-font-size-1--lg));
+  --ds-font-size-2:
+    var(--ds-size--sm, var(--ds-font-size-2--sm))
+    var(--ds-size--md, var(--ds-font-size-2--md))
+    var(--ds-size--lg, var(--ds-font-size-2--lg));
+  --ds-font-size-3:
+    var(--ds-size--sm, var(--ds-font-size-3--sm))
+    var(--ds-size--md, var(--ds-font-size-3--md))
+    var(--ds-size--lg, var(--ds-font-size-3--lg));
+  --ds-font-size-4:
+    var(--ds-size--sm, var(--ds-font-size-4--sm))
+    var(--ds-size--md, var(--ds-font-size-4--md))
+    var(--ds-size--lg, var(--ds-font-size-4--lg));
+  --ds-font-size-5:
+    var(--ds-size--sm, var(--ds-font-size-5--sm))
+    var(--ds-size--md, var(--ds-font-size-5--md))
+    var(--ds-size--lg, var(--ds-font-size-5--lg));
+  --ds-font-size-6:
+    var(--ds-size--sm, var(--ds-font-size-6--sm))
+    var(--ds-size--md, var(--ds-font-size-6--md))
+    var(--ds-size--lg, var(--ds-font-size-6--lg));
+  --ds-font-size-7:
+    var(--ds-size--sm, var(--ds-font-size-7--sm))
+    var(--ds-size--md, var(--ds-font-size-7--md))
+    var(--ds-size--lg, var(--ds-font-size-7--lg));
+  --ds-font-size-8:
+    var(--ds-size--sm, var(--ds-font-size-8--sm))
+    var(--ds-size--md, var(--ds-font-size-8--md))
+    var(--ds-size--lg, var(--ds-font-size-8--lg));
+  --ds-font-size-9:
+    var(--ds-size--sm, var(--ds-font-size-9--sm))
+    var(--ds-size--md, var(--ds-font-size-9--md))
+    var(--ds-size--lg, var(--ds-font-size-9--lg));
+  --ds-font-size-10:
+    var(--ds-size--sm, var(--ds-font-size-10--sm))
+    var(--ds-size--md, var(--ds-font-size-10--md))
+    var(--ds-size--lg, var(--ds-font-size-10--lg));
   --ds-heading-2xl-font-size: var(--ds-font-size-10);
   --ds-heading-xl-font-size: var(--ds-font-size-9);
   --ds-heading-lg-font-size: var(--ds-font-size-8);
@@ -74,21 +154,9 @@ design-tokens: v1.5.1
   --ds-body-long-md-font-size: var(--ds-font-size-4);
   --ds-body-long-sm-font-size: var(--ds-font-size-3);
   --ds-body-long-xs-font-size: var(--ds-font-size-2);
-
-  @supports (width: round(down, .1em, 1px)) {
-    --ds-font-size-1: round(calc(0.75rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-2: round(calc(0.875rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-3: round(calc(1rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-4: round(calc(1.125rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-5: round(calc(1.3125rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-6: round(calc(1.5rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-7: round(calc(1.875rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-8: round(calc(2.25rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-9: round(calc(3rem * var(--_ds-font-size-factor)), 1px);
-    --ds-font-size-10: round(calc(3.75rem * var(--_ds-font-size-factor)), 1px);
-  }
 }
 }
+
 @layer ds.theme.color-scheme.light {
 :root, [data-color-scheme="light"] {
   --ds-color-accent-background-default: #ffffff;