diff --git a/docs/index.html b/docs/index.html
index 3b9e8c6..0a64a38 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -1,5 +1,5 @@
-<!doctype html><html lang="en"><head><meta charset="utf-8"><title>@aurodesignsystem/webcorestylesheets - v10.1.3</title><link rel="stylesheet" href="assets/css/main.css"><link href="https://fonts.googleapis.com/css?family=Open+Sans:400,500,700" rel="stylesheet" type="text/css"><meta name="viewport" content="width=device-width"><meta content="IE=edge, chrome=1" http-equiv="X-UA-Compatible"><!-- Open Graph tags --><meta property="og:title" content="@aurodesignsystem/webcorestylesheets - SassDoc"><meta property="og:type" content="website"><meta property="og:description" content="<p>Auro core foundation Sass UI Kit</p>
-"><!-- Thanks to Sass-lang.com for the icons --><link href="assets/images/favicon.png" rel="shortcut icon"></head><body><aside class="sidebar" role="nav"><div class="sidebar__header"><h1 class="sidebar__title">@aurodesignsystem/webcorestylesheets - 10.1.3</h1></div><div class="sidebar__body"><button type="button" class="btn-toggle js-btn-toggle" data-alt="Open all">Close all</button><p class="sidebar__item sidebar__item--heading" data-slug="accessibility"><a href="#accessibility">accessibility</a></p><div><p class="sidebar__item sidebar__item--sub-heading" data-slug="accessibility-css"><a href="#accessibility-css">css</a></p><ul class="list-unstyled"><li class="sidebar__item sassdoc__item" data-group="accessibility" data-name=":focus" data-type="css"><a href="#accessibility-css-:focus">:focus</a></li><li class="sidebar__item sassdoc__item" data-group="accessibility" data-name="&amp;:focus-visible" data-type="css"><a href="#accessibility-css-&amp;:focus-visible">&amp;:focus-visible</a></li></ul></div><p class="sidebar__item sidebar__item--heading" data-slug="animation"><a href="#animation">animation</a></p><div><p class="sidebar__item sidebar__item--sub-heading" data-slug="animation-mixin"><a href="#animation-mixin">mixins</a></p><ul class="list-unstyled"><li class="sidebar__item sassdoc__item" data-group="animation" data-name="auro_transition" data-type="mixin"><a href="#animation-mixin-auro_transition">auro_transition</a></li></ul></div><p class="sidebar__item sidebar__item--heading" data-slug="component-support"><a href="#component-support">component-support</a></p><div><p class="sidebar__item sidebar__item--sub-heading" data-slug="component-support-css"><a href="#component-support-css">css</a></p><ul class="list-unstyled"><li class="sidebar__item sassdoc__item" data-group="component-support" data-name=":host" data-type="css"><a href="#component-support-css-:host">:host</a></li><li class="sidebar__item sassdoc__item" data-group="component-support" data-name=":host([hidden]:not(:focus):not(:active))" data-type="css"><a href="#component-support-css-:host([hidden]:not(:focus):not(:active))">:host([hidden]:not(:focus):not(:active))</a></li><li class="sidebar__item sassdoc__item" data-group="component-support" data-name=":host([hiddenVisually]:not(:focus):not(:active))" data-type="css"><a href="#component-support-css-:host([hiddenVisually]:not(:focus):not(:active))">:host([hiddenVisually]:not(:focus):not(:active))</a></li></ul></div><p class="sidebar__item sidebar__item--heading" data-slug="container"><a href="#container">container</a></p><div><p class="sidebar__item sidebar__item--sub-heading" data-slug="container-css"><a href="#container-css">css</a></p><ul class="list-unstyled"><li class="sidebar__item sassdoc__item" data-group="container" data-name="#{$scope}.#{$prefix}container" data-type="css"><a href="#container-css-#{$scope}.#{$prefix}container">#{$scope}.#{$prefix}container</a></li><li class="sidebar__item sassdoc__item" data-group="container" data-name="#{$scope}.#{$prefix}pagecontainer" data-type="css"><a href="#container-css-#{$scope}.#{$prefix}pagecontainer">#{$scope}.#{$prefix}pagecontainer</a></li></ul></div><p class="sidebar__item sidebar__item--heading" data-slug="core"><a href="#core">core</a></p><div><p class="sidebar__item sidebar__item--sub-heading" data-slug="core-css"><a href="#core-css">css</a></p><ul class="list-unstyled"><li class="sidebar__item sassdoc__item" data-group="core" data-name="#{$sym}#{$prefix}#{$scope}blockquote" data-type="css"><a href="#core-css-#{$sym}#{$prefix}#{$scope}blockquote">#{$sym}#{$prefix}#{$scope}blockquote</a></li><li class="sidebar__item sassdoc__item" data-group="core" data-name="#{$sym}#{$prefix}picture#{$scope}" data-type="css"><a href="#core-css-#{$sym}#{$prefix}picture#{$scope}">#{$sym}#{$prefix}picture#{$scope}</a></li></ul></div><p class="sidebar__item sidebar__item--heading" data-slug="essentials"><a href="#essentials">essentials</a></p><div><p class="sidebar__item sidebar__item--sub-heading" data-slug="essentials-css"><a href="#essentials-css">css</a></p><ul class="list-unstyled"><li class="sidebar__item sassdoc__item" data-group="essentials" data-name="#{$sym}#{$prefix}html#{$scope}" data-type="css"><a href="#essentials-css-#{$sym}#{$prefix}html#{$scope}">#{$sym}#{$prefix}html#{$scope}</a></li><li class="sidebar__item sassdoc__item" data-group="essentials" data-name="#{$scope}#{$sym}#{$prefix}body,
+<!doctype html><html lang="en"><head><meta charset="utf-8"><title>@aurodesignsystem/webcorestylesheets - v10.1.4</title><link rel="stylesheet" href="assets/css/main.css"><link href="https://fonts.googleapis.com/css?family=Open+Sans:400,500,700" rel="stylesheet" type="text/css"><meta name="viewport" content="width=device-width"><meta content="IE=edge, chrome=1" http-equiv="X-UA-Compatible"><!-- Open Graph tags --><meta property="og:title" content="@aurodesignsystem/webcorestylesheets - SassDoc"><meta property="og:type" content="website"><meta property="og:description" content="<p>Auro core foundation Sass UI Kit</p>
+"><!-- Thanks to Sass-lang.com for the icons --><link href="assets/images/favicon.png" rel="shortcut icon"></head><body><aside class="sidebar" role="nav"><div class="sidebar__header"><h1 class="sidebar__title">@aurodesignsystem/webcorestylesheets - 10.1.4</h1></div><div class="sidebar__body"><button type="button" class="btn-toggle js-btn-toggle" data-alt="Open all">Close all</button><p class="sidebar__item sidebar__item--heading" data-slug="accessibility"><a href="#accessibility">accessibility</a></p><div><p class="sidebar__item sidebar__item--sub-heading" data-slug="accessibility-css"><a href="#accessibility-css">css</a></p><ul class="list-unstyled"><li class="sidebar__item sassdoc__item" data-group="accessibility" data-name=":focus" data-type="css"><a href="#accessibility-css-:focus">:focus</a></li><li class="sidebar__item sassdoc__item" data-group="accessibility" data-name="&amp;:focus-visible" data-type="css"><a href="#accessibility-css-&amp;:focus-visible">&amp;:focus-visible</a></li></ul></div><p class="sidebar__item sidebar__item--heading" data-slug="animation"><a href="#animation">animation</a></p><div><p class="sidebar__item sidebar__item--sub-heading" data-slug="animation-mixin"><a href="#animation-mixin">mixins</a></p><ul class="list-unstyled"><li class="sidebar__item sassdoc__item" data-group="animation" data-name="auro_transition" data-type="mixin"><a href="#animation-mixin-auro_transition">auro_transition</a></li></ul></div><p class="sidebar__item sidebar__item--heading" data-slug="component-support"><a href="#component-support">component-support</a></p><div><p class="sidebar__item sidebar__item--sub-heading" data-slug="component-support-css"><a href="#component-support-css">css</a></p><ul class="list-unstyled"><li class="sidebar__item sassdoc__item" data-group="component-support" data-name=":host" data-type="css"><a href="#component-support-css-:host">:host</a></li><li class="sidebar__item sassdoc__item" data-group="component-support" data-name=":host([hidden]:not(:focus):not(:active))" data-type="css"><a href="#component-support-css-:host([hidden]:not(:focus):not(:active))">:host([hidden]:not(:focus):not(:active))</a></li><li class="sidebar__item sassdoc__item" data-group="component-support" data-name=":host([hiddenVisually]:not(:focus):not(:active))" data-type="css"><a href="#component-support-css-:host([hiddenVisually]:not(:focus):not(:active))">:host([hiddenVisually]:not(:focus):not(:active))</a></li></ul></div><p class="sidebar__item sidebar__item--heading" data-slug="container"><a href="#container">container</a></p><div><p class="sidebar__item sidebar__item--sub-heading" data-slug="container-css"><a href="#container-css">css</a></p><ul class="list-unstyled"><li class="sidebar__item sassdoc__item" data-group="container" data-name="#{$scope}.#{$prefix}container" data-type="css"><a href="#container-css-#{$scope}.#{$prefix}container">#{$scope}.#{$prefix}container</a></li><li class="sidebar__item sassdoc__item" data-group="container" data-name="#{$scope}.#{$prefix}pagecontainer" data-type="css"><a href="#container-css-#{$scope}.#{$prefix}pagecontainer">#{$scope}.#{$prefix}pagecontainer</a></li></ul></div><p class="sidebar__item sidebar__item--heading" data-slug="core"><a href="#core">core</a></p><div><p class="sidebar__item sidebar__item--sub-heading" data-slug="core-css"><a href="#core-css">css</a></p><ul class="list-unstyled"><li class="sidebar__item sassdoc__item" data-group="core" data-name="#{$sym}#{$prefix}#{$scope}blockquote" data-type="css"><a href="#core-css-#{$sym}#{$prefix}#{$scope}blockquote">#{$sym}#{$prefix}#{$scope}blockquote</a></li><li class="sidebar__item sassdoc__item" data-group="core" data-name="#{$sym}#{$prefix}picture#{$scope}" data-type="css"><a href="#core-css-#{$sym}#{$prefix}picture#{$scope}">#{$sym}#{$prefix}picture#{$scope}</a></li></ul></div><p class="sidebar__item sidebar__item--heading" data-slug="essentials"><a href="#essentials">essentials</a></p><div><p class="sidebar__item sidebar__item--sub-heading" data-slug="essentials-css"><a href="#essentials-css">css</a></p><ul class="list-unstyled"><li class="sidebar__item sassdoc__item" data-group="essentials" data-name="#{$sym}#{$prefix}html#{$scope}" data-type="css"><a href="#essentials-css-#{$sym}#{$prefix}html#{$scope}">#{$sym}#{$prefix}html#{$scope}</a></li><li class="sidebar__item sassdoc__item" data-group="essentials" data-name="#{$scope}#{$sym}#{$prefix}body,
 #{$scope}.#{$prefix}baseType" data-type="css"><a href="#essentials-css-#{$scope}#{$sym}#{$prefix}body,
 #{$scope}.#{$prefix}baseType">#{$scope}#{$sym}#{$prefix}body, #{$scope}.#{$prefix}baseType</a></li><li class="sidebar__item sassdoc__item" data-group="essentials" data-name="#{$scope}.#{$prefix}baseParagraph" data-type="css"><a href="#essentials-css-#{$scope}.#{$prefix}baseParagraph">#{$scope}.#{$prefix}baseParagraph</a></li><li class="sidebar__item sassdoc__item" data-group="essentials" data-name="#{$scope}.#{$prefix}hyperlink" data-type="css"><a href="#essentials-css-#{$scope}.#{$prefix}hyperlink">#{$scope}.#{$prefix}hyperlink</a></li><li class="sidebar__item sassdoc__item" data-group="essentials" data-name="#{$scope}#{$sym}#{$prefix}img" data-type="css"><a href="#essentials-css-#{$scope}#{$sym}#{$prefix}img">#{$scope}#{$sym}#{$prefix}img</a></li><li class="sidebar__item sassdoc__item" data-group="essentials" data-name="#{$scope}#{$sym}#{$prefix}small,
 #{$scope}.#{$prefix}type--small" data-type="css"><a href="#essentials-css-#{$scope}#{$sym}#{$prefix}small,
@@ -1530,4 +1530,4 @@
   white-space: nowrap $important;
 }</code>" data-collapsed="#{$scope}.#{$prefix}util_nowrap { ... }"><code>#{$scope}.#{$prefix}util_nowrap { ... }</code></pre></div><h3 class="item__sub-heading">Description</h3><div class="item__description"><p>Utility class force no wrap on content</p><p><a href="/#utility-variable-important">Manage</a> <code>!important</code> flag.</p><p><a href="/#scope-prefix-variable-scope">Manage</a> <code>$scope</code> and <code>$prefix</code> options.</p></div><h3 class="item__sub-heading">Example</h3><div class="item__example example"><div class="example__description"><p>Default selector(s)</p></div><pre class="example__code language-scss"><code>.util_nowrap {}</code></pre></div><div class="item__example example"><div class="example__description"><p>Selector(s) when $scope: true;</p></div><pre class="example__code language-scss"><code>.auro .util_nowrap {}</code></pre></div><div class="item__example example"><div class="example__description"><p>Selector(s) when $prefix: true;</p></div><pre class="example__code language-scss"><code>.auro_util_nowrap {}</code></pre></div><div class="item__example example"><div class="example__description"><p>import mixin file</p></div><pre class="example__code language-scss"><code>@import &quot;./node_modules/@aurodesignsystem/webcorestylesheets/dist/utilityClasses/typeProperties&quot;;</code></pre></div></section><section class="main__item container item" id="utility-type-css-#{$scope}.#{$prefix}util_capitalize"><h3 class="item__heading"><a class="item__name" href="#css-#{$scope}.#{$prefix}util_capitalize">#{$scope}.#{$prefix}util_capitalize</a></h3><div class="item__code-wrapper"><pre class="item__code item__code--togglable language-scss" data-current-state="collapsed" data-expanded="<code>#{$scope}.#{$prefix}util_capitalize {
   text-transform: capitalize $important;
-}</code>" data-collapsed="#{$scope}.#{$prefix}util_capitalize { ... }"><code>#{$scope}.#{$prefix}util_capitalize { ... }</code></pre></div><h3 class="item__sub-heading">Description</h3><div class="item__description"><p>Utility class to capitalize a string</p><p><a href="/#utility-variable-important">Manage</a> <code>!important</code> flag.</p><p><a href="/#scope-prefix-variable-scope">Manage</a> <code>$scope</code> and <code>$prefix</code> options.</p></div><h3 class="item__sub-heading">Example</h3><div class="item__example example"><div class="example__description"><p>Default selector(s)</p></div><pre class="example__code language-scss"><code>.util_capitalize {}</code></pre></div><div class="item__example example"><div class="example__description"><p>Selector(s) when $scope: true;</p></div><pre class="example__code language-scss"><code>.auro .util_capitalize {}</code></pre></div><div class="item__example example"><div class="example__description"><p>Selector(s) when $prefix: true;</p></div><pre class="example__code language-scss"><code>.auro_util_capitalize {}</code></pre></div><div class="item__example example"><div class="example__description"><p>import mixin file</p></div><pre class="example__code language-scss"><code>@import &quot;./node_modules/@aurodesignsystem/webcorestylesheets/dist/utilityClasses/typeProperties&quot;;</code></pre></div></section></section></section><section class="main__section"><h1 class="main__heading" id="utility-variables"><div class="container">utility-variables</div></h1><section class="main__sub-section" id="utility-variables-variable"><h2 class="main__heading--secondary"><div class="container">variables</div></h2><section class="main__item container item" id="utility-variables-variable-css-ns"><h3 class="item__heading"><a class="item__name" href="#variable-css-ns">css-ns</a></h3><div class="item__code-wrapper"><pre class="item__code language-scss"><code>$css-ns: &quot;wcss&quot; !default;</code></pre></div><h3 class="item__sub-heading">Description</h3><div class="item__description"><p>Global CSS theme custom property namespace</p><p>Defines the namespace used for all CSS theme custom properties</p></div><h3 class="item__sub-heading">Type</h3><p><code>String</code></p><h3 class="item__sub-heading">Example</h3><div class="item__example example"><pre class="example__code language-scss"><code>$css-ns: &#39;auro&#39;; // Would result in --auro-property-name</code></pre></div></section></section></section><footer class="footer" role="contentinfo"><div class="container"><div class="footer__project-info project-info"><!-- Name and URL --> <span class="project-info__name">@aurodesignsystem/webcorestylesheets</span><!-- Version --> <span class="project-info__version">- v10.1.3</span><!-- License --> <span class="project-info__license">, under Apache-2.0</span></div><a class="footer__watermark" href="http://sassdoc.com"><img src="assets/images/logo_light_inline.svg" alt="SassDoc Logo"></a></div></footer></article><script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><script>window.jQuery || document.write('<script src="assets/js/vendor/jquery.min.js"><\/script>')</script><script src="assets/js/main.min.js"></script></body></html>
\ No newline at end of file
+}</code>" data-collapsed="#{$scope}.#{$prefix}util_capitalize { ... }"><code>#{$scope}.#{$prefix}util_capitalize { ... }</code></pre></div><h3 class="item__sub-heading">Description</h3><div class="item__description"><p>Utility class to capitalize a string</p><p><a href="/#utility-variable-important">Manage</a> <code>!important</code> flag.</p><p><a href="/#scope-prefix-variable-scope">Manage</a> <code>$scope</code> and <code>$prefix</code> options.</p></div><h3 class="item__sub-heading">Example</h3><div class="item__example example"><div class="example__description"><p>Default selector(s)</p></div><pre class="example__code language-scss"><code>.util_capitalize {}</code></pre></div><div class="item__example example"><div class="example__description"><p>Selector(s) when $scope: true;</p></div><pre class="example__code language-scss"><code>.auro .util_capitalize {}</code></pre></div><div class="item__example example"><div class="example__description"><p>Selector(s) when $prefix: true;</p></div><pre class="example__code language-scss"><code>.auro_util_capitalize {}</code></pre></div><div class="item__example example"><div class="example__description"><p>import mixin file</p></div><pre class="example__code language-scss"><code>@import &quot;./node_modules/@aurodesignsystem/webcorestylesheets/dist/utilityClasses/typeProperties&quot;;</code></pre></div></section></section></section><section class="main__section"><h1 class="main__heading" id="utility-variables"><div class="container">utility-variables</div></h1><section class="main__sub-section" id="utility-variables-variable"><h2 class="main__heading--secondary"><div class="container">variables</div></h2><section class="main__item container item" id="utility-variables-variable-css-ns"><h3 class="item__heading"><a class="item__name" href="#variable-css-ns">css-ns</a></h3><div class="item__code-wrapper"><pre class="item__code language-scss"><code>$css-ns: &quot;wcss&quot; !default;</code></pre></div><h3 class="item__sub-heading">Description</h3><div class="item__description"><p>Global CSS theme custom property namespace</p><p>Defines the namespace used for all CSS theme custom properties</p></div><h3 class="item__sub-heading">Type</h3><p><code>String</code></p><h3 class="item__sub-heading">Example</h3><div class="item__example example"><pre class="example__code language-scss"><code>$css-ns: &#39;auro&#39;; // Would result in --auro-property-name</code></pre></div></section></section></section><footer class="footer" role="contentinfo"><div class="container"><div class="footer__project-info project-info"><!-- Name and URL --> <span class="project-info__name">@aurodesignsystem/webcorestylesheets</span><!-- Version --> <span class="project-info__version">- v10.1.4</span><!-- License --> <span class="project-info__license">, under Apache-2.0</span></div><a class="footer__watermark" href="http://sassdoc.com"><img src="assets/images/logo_light_inline.svg" alt="SassDoc Logo"></a></div></footer></article><script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><script>window.jQuery || document.write('<script src="assets/js/vendor/jquery.min.js"><\/script>')</script><script src="assets/js/main.min.js"></script></body></html>
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index 52e9bc3..649f085 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,16 +1,16 @@
 {
   "name": "@aurodesignsystem/webcorestylesheets",
-  "version": "10.1.0",
+  "version": "10.1.4",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@aurodesignsystem/webcorestylesheets",
-      "version": "10.1.0",
+      "version": "10.1.4",
       "hasInstallScript": true,
       "license": "Apache-2.0",
       "dependencies": {
-        "@aurodesignsystem/design-tokens": "8.5.0",
+        "@aurodesignsystem/design-tokens": "^8.18.0",
         "chalk": "^5.4.1"
       },
       "devDependencies": {
@@ -61,16 +61,12 @@
       }
     },
     "node_modules/@aurodesignsystem/design-tokens": {
-      "version": "8.5.0",
-      "resolved": "https://registry.npmjs.org/@aurodesignsystem/design-tokens/-/design-tokens-8.5.0.tgz",
-      "integrity": "sha512-RygKVYYU5c9d78MXRxXSO+VQTmpqzvyxk+MgsmtPex6eG5R++PuJbCTK8UYOSG9pUdPV11cX2/avtgJIrJPPJw==",
-      "hasInstallScript": true,
-      "dependencies": {
-        "chalk": "^5.4.1",
-        "postcss": "^8.5.6"
-      },
+      "version": "8.18.0",
+      "resolved": "https://registry.npmjs.org/@aurodesignsystem/design-tokens/-/design-tokens-8.18.0.tgz",
+      "integrity": "sha512-dulw0o7rA/iqV4eyRElDctBcxonguTWqRy9qGQKcAtU6HPhccGqwCzPv7kINDqO/FJp6mWLb7zQ5/3iJ1HZf8w==",
+      "license": "Apache-2.0",
       "engines": {
-        "node": "^20.x || ^22.x"
+        "node": "^22.14.0 || >= 24.10.0"
       }
     },
     "node_modules/@babel/code-frame": {
@@ -12236,6 +12232,7 @@
       "version": "3.3.11",
       "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.11.tgz",
       "integrity": "sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==",
+      "dev": true,
       "funding": [
         {
           "type": "github",
@@ -16339,6 +16336,7 @@
       "version": "8.5.6",
       "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.6.tgz",
       "integrity": "sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==",
+      "dev": true,
       "funding": [
         {
           "type": "opencollective",
@@ -17008,7 +17006,8 @@
     "node_modules/postcss/node_modules/picocolors": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz",
-      "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA=="
+      "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==",
+      "dev": true
     },
     "node_modules/prelude-ls": {
       "version": "1.1.2",
@@ -19955,6 +19954,7 @@
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
       "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
+      "dev": true,
       "engines": {
         "node": ">=0.10.0"
       }
diff --git a/package.json b/package.json
index 853dd4a..ae9541d 100644
--- a/package.json
+++ b/package.json
@@ -16,7 +16,7 @@
     "sass": "^1.42.1"
   },
   "dependencies": {
-    "@aurodesignsystem/design-tokens": "8.5.0",
+    "@aurodesignsystem/design-tokens": "^8.18.0",
     "chalk": "^5.4.1"
   },
   "devDependencies": {
diff --git a/packageScripts/postinstall.mjs b/packageScripts/postinstall.mjs
index fbfa3ac..9b9f7bd 100644
--- a/packageScripts/postinstall.mjs
+++ b/packageScripts/postinstall.mjs
@@ -23,7 +23,7 @@ chalk.hex('#f26135')(`
        Thanks for installing the latest version
                of `) + chalk.hex('#ffd200').bold(`WC Stylesheets v${pjson.version}.`) + chalk.hex('#f26135')(`
 
-            Requires Design Tokens ${pjson.peerDependencies["@aurodesignsystem/design-tokens"]}
+            Requires Design Tokens ${pjson.dependencies["@aurodesignsystem/design-tokens"]}
       npm i @aurodesignsystem/design-tokens@latest
 
 ╰─────────────────────────────── ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─╯
diff --git a/src/config/alaska-classic/type/body.scss b/src/config/alaska-classic/type/body.scss
index 2d7c559..c0d14d3 100644
--- a/src/config/alaska-classic/type/body.scss
+++ b/src/config/alaska-classic/type/body.scss
@@ -2,28 +2,57 @@
 $alaska-classic-type-body-config: (
   'family': v.$ds-basic-type-family-body,
   'familyFallback': v.$ds-basic-type-family-body-fallback,
-  'weight': v.$ds-basic-type-weight-body,
   'letter-spacing': v.$ds-basic-type-letter-spacing-body,
   'sizes': (
     'default': (
       'font-size': v.$ds-type-size-16,
-      'line-height': v.$ds-basic-type-line-height-body2
+      'line-height': v.$ds-basic-type-line-height-body2,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    'default-emphasized': (
+      'font-size': v.$ds-type-size-16,
+      'line-height': v.$ds-basic-type-line-height-body2,
+      'weight': v.$ds-basic-type-weight-body2
     ),
     'lg': (
       'font-size': v.$ds-type-size-18,
-      'line-height': v.$ds-basic-type-line-height-body
+      'line-height': v.$ds-basic-type-line-height-body,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    'lg-emphasized': (
+      'font-size': v.$ds-type-size-18,
+      'line-height': v.$ds-basic-type-line-height-body,
+      'weight': v.$ds-basic-type-weight-body2
     ),
     'sm': (
       'font-size': v.$ds-type-size-14,
-      'line-height': v.$ds-basic-type-line-height-body3
+      'line-height': v.$ds-basic-type-line-height-body3,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    'sm-emphasized': (
+      'font-size': v.$ds-type-size-14,
+      'line-height': v.$ds-basic-type-line-height-body3,
+      'weight': v.$ds-basic-type-weight-body2
     ),
     'xs': (
       'font-size': v.$ds-type-size-12,
-      'line-height': v.$ds-basic-type-line-height-body4
+      'line-height': v.$ds-basic-type-line-height-body4,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    'xs-emphasized': (
+      'font-size': v.$ds-type-size-12,
+      'line-height': v.$ds-basic-type-line-height-body4,
+      'weight': v.$ds-basic-type-weight-body2
     ),
     '2xs': (
       'font-size': v.$ds-type-size-10,
-      'line-height': v.$ds-basic-type-line-height-body5
+      'line-height': v.$ds-basic-type-line-height-body5,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    '2xs-emphasized': (
+      'font-size': v.$ds-type-size-10,
+      'line-height': v.$ds-basic-type-line-height-body5,
+      'weight': v.$ds-basic-type-weight-body2
     )
   )
 );
diff --git a/src/config/alaska/type/body.scss b/src/config/alaska/type/body.scss
index fcc53ed..f024a7d 100644
--- a/src/config/alaska/type/body.scss
+++ b/src/config/alaska/type/body.scss
@@ -2,28 +2,57 @@
 $alaska-type-body-config: (
   'family': v.$ds-basic-type-family-body,
   'familyFallback': v.$ds-basic-type-family-body-fallback,
-  'weight': v.$ds-basic-type-weight-body,
   'letter-spacing': v.$ds-basic-type-letter-spacing-body,
   'sizes': (
     'default': (
       'font-size': v.$ds-type-size-16,
-      'line-height': v.$ds-basic-type-line-height-body2
+      'line-height': v.$ds-basic-type-line-height-body2,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    'default-emphasized': (
+      'font-size': v.$ds-type-size-16,
+      'line-height': v.$ds-basic-type-line-height-body2,
+      'weight': v.$ds-type-weight-medium
     ),
     'lg': (
       'font-size': v.$ds-type-size-18,
-      'line-height': v.$ds-basic-type-line-height-body
+      'line-height': v.$ds-basic-type-line-height-body,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    'lg-emphasized': (
+      'font-size': v.$ds-type-size-18,
+      'line-height': v.$ds-basic-type-line-height-body,
+      'weight': v.$ds-type-weight-medium
     ),
     'sm': (
       'font-size': v.$ds-type-size-14,
-      'line-height': v.$ds-basic-type-line-height-body3
+      'line-height': v.$ds-basic-type-line-height-body3,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    'sm-emphasized': (
+      'font-size': v.$ds-type-size-14,
+      'line-height': v.$ds-basic-type-line-height-body3,
+      'weight': v.$ds-type-weight-medium
     ),
     'xs': (
       'font-size': v.$ds-type-size-12,
-      'line-height': v.$ds-basic-type-line-height-body4
+      'line-height': v.$ds-basic-type-line-height-body4,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    'xs-emphasized': (
+      'font-size': v.$ds-type-size-12,
+      'line-height': v.$ds-basic-type-line-height-body4,
+      'weight': v.$ds-type-weight-medium
     ),
     '2xs': (
       'font-size': v.$ds-type-size-10,
-      'line-height': v.$ds-basic-type-line-height-body5
+      'line-height': v.$ds-basic-type-line-height-body5,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    '2xs-emphasized': (
+      'font-size': v.$ds-type-size-10,
+      'line-height': v.$ds-basic-type-line-height-body5,
+      'weight': v.$ds-type-weight-medium
     )
   )
 );
diff --git a/src/config/alaska/type/heading.scss b/src/config/alaska/type/heading.scss
index 1296d41..98e533e 100644
--- a/src/config/alaska/type/heading.scss
+++ b/src/config/alaska/type/heading.scss
@@ -43,7 +43,7 @@ $alaska-type-heading-config: (
         'max': v.$ds-type-size-20,
         'preferred': v.$ds-type-size-20
       ),
-      'weight': v.$ds-basic-type-weight-heading2
+      'weight': v.$ds-basic-type-weight-heading
     ),
     '2xs': (
       'font-size': (
@@ -51,7 +51,7 @@ $alaska-type-heading-config: (
         'max': v.$ds-type-size-18,
         'preferred': v.$ds-type-size-18
       ),
-      'weight': v.$ds-basic-type-weight-heading2
+      'weight': v.$ds-basic-type-weight-heading
     )
   )
 );
diff --git a/src/config/auro-1/type/body.scss b/src/config/auro-1/type/body.scss
index 066befe..5e17021 100644
--- a/src/config/auro-1/type/body.scss
+++ b/src/config/auro-1/type/body.scss
@@ -2,28 +2,57 @@
 $auro-1-type-body-config: (
   'family': v.$ds-basic-type-family-body,
   'familyFallback': v.$ds-basic-type-family-body-fallback,
-  'weight': v.$ds-basic-type-weight-body,
   'letter-spacing': v.$ds-basic-type-letter-spacing-body,
   'sizes': (
     'default': (
       'font-size': v.$ds-type-size-16,
-      'line-height': v.$ds-basic-type-line-height-body2
+      'line-height': v.$ds-basic-type-line-height-body2,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    'default-emphasized': (
+      'font-size': v.$ds-type-size-16,
+      'line-height': v.$ds-basic-type-line-height-body2,
+      'weight': v.$ds-type-weight-medium
     ),
     'lg': (
       'font-size': v.$ds-type-size-18,
-      'line-height': v.$ds-basic-type-line-height-body
+      'line-height': v.$ds-basic-type-line-height-body,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    'lg-emphasized': (
+      'font-size': v.$ds-type-size-18,
+      'line-height': v.$ds-basic-type-line-height-body,
+      'weight': v.$ds-type-weight-medium
     ),
     'sm': (
       'font-size': v.$ds-type-size-14,
-      'line-height': v.$ds-basic-type-line-height-body3
+      'line-height': v.$ds-basic-type-line-height-body3,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    'sm-emphasized': (
+      'font-size': v.$ds-type-size-14,
+      'line-height': v.$ds-basic-type-line-height-body3,
+      'weight': v.$ds-type-weight-medium
     ),
     'xs': (
       'font-size': v.$ds-type-size-12,
-      'line-height': v.$ds-basic-type-line-height-body4
+      'line-height': v.$ds-basic-type-line-height-body4,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    'xs-emphasized': (
+      'font-size': v.$ds-type-size-12,
+      'line-height': v.$ds-basic-type-line-height-body4,
+      'weight': v.$ds-type-weight-medium
     ),
     '2xs': (
       'font-size': v.$ds-type-size-10,
-      'line-height': v.$ds-basic-type-line-height-body5
+      'line-height': v.$ds-basic-type-line-height-body5,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    '2xs-emphasized': (
+      'font-size': v.$ds-type-size-10,
+      'line-height': v.$ds-basic-type-line-height-body5,
+      'weight': v.$ds-type-weight-medium
     )
   )
 );
diff --git a/src/config/auro-2/type/body.scss b/src/config/auro-2/type/body.scss
index 74070f3..4142d94 100644
--- a/src/config/auro-2/type/body.scss
+++ b/src/config/auro-2/type/body.scss
@@ -2,28 +2,57 @@
 $auro-2-type-body-config: (
   'family': v.$ds-basic-type-family-body,
   'familyFallback': v.$ds-basic-type-family-body-fallback,
-  'weight': v.$ds-basic-type-weight-body,
   'letter-spacing': v.$ds-basic-type-letter-spacing-body,
   'sizes': (
     'default': (
       'font-size': v.$ds-type-size-16,
-      'line-height': v.$ds-basic-type-line-height-body2
+      'line-height': v.$ds-basic-type-line-height-body2,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    'default-emphasized': (
+      'font-size': v.$ds-type-size-16,
+      'line-height': v.$ds-basic-type-line-height-body2,
+      'weight': v.$ds-type-weight-medium
     ),
     'lg': (
       'font-size': v.$ds-type-size-18,
-      'line-height': v.$ds-basic-type-line-height-body
+      'line-height': v.$ds-basic-type-line-height-body,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    'lg-emphasized': (
+      'font-size': v.$ds-type-size-18,
+      'line-height': v.$ds-basic-type-line-height-body,
+      'weight': v.$ds-type-weight-medium
     ),
     'sm': (
       'font-size': v.$ds-type-size-14,
-      'line-height': v.$ds-basic-type-line-height-body3
+      'line-height': v.$ds-basic-type-line-height-body3,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    'sm-emphasized': (
+      'font-size': v.$ds-type-size-14,
+      'line-height': v.$ds-basic-type-line-height-body3,
+      'weight': v.$ds-type-weight-medium
     ),
     'xs': (
       'font-size': v.$ds-type-size-12,
-      'line-height': v.$ds-basic-type-line-height-body4
+      'line-height': v.$ds-basic-type-line-height-body4,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    'xs-emphasized': (
+      'font-size': v.$ds-type-size-12,
+      'line-height': v.$ds-basic-type-line-height-body4,
+      'weight': v.$ds-type-weight-medium
     ),
     '2xs': (
       'font-size': v.$ds-type-size-10,
-      'line-height': v.$ds-basic-type-line-height-body5
+      'line-height': v.$ds-basic-type-line-height-body5,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    '2xs-emphasized': (
+      'font-size': v.$ds-type-size-10,
+      'line-height': v.$ds-basic-type-line-height-body5,
+      'weight': v.$ds-type-weight-medium
     )
   )
 );
diff --git a/src/config/hawaiian/type/accent.scss b/src/config/hawaiian/type/accent.scss
index 14b8a39..69f31be 100644
--- a/src/config/hawaiian/type/accent.scss
+++ b/src/config/hawaiian/type/accent.scss
@@ -10,7 +10,6 @@ $hawaiian-type-accent-config: (
         'preferred': v.$ds-type-size-38
       ),
       'weight': v.$ds-basic-type-weight-accent,
-      'letter-spacing': v.$ds-basic-type-letter-spacing-accent,
       'line-height': v.$ds-basic-type-line-height-accent2
     ),
     'xl': (
@@ -20,7 +19,6 @@ $hawaiian-type-accent-config: (
         'preferred': v.$ds-type-size-28
       ),
       'weight': v.$ds-basic-type-weight-accent,
-      'letter-spacing': v.$ds-basic-type-letter-spacing-accent,
       'line-height': v.$ds-basic-type-line-height-accent
     ),
     'lg': (
@@ -30,7 +28,6 @@ $hawaiian-type-accent-config: (
         'preferred': v.$ds-type-size-26
       ),
       'weight': v.$ds-basic-type-weight-accent,
-      'letter-spacing': v.$ds-basic-type-letter-spacing-accent,
       'line-height': v.$ds-basic-type-line-height-accent
     ),
     'md': (
@@ -40,7 +37,6 @@ $hawaiian-type-accent-config: (
         'preferred': v.$ds-type-size-22
       ),
       'weight': v.$ds-basic-type-weight-accent2,
-      'letter-spacing': v.$ds-basic-type-letter-spacing-accent,
       'line-height': v.$ds-basic-type-line-height-accent
     ),
     'sm': (
@@ -50,7 +46,6 @@ $hawaiian-type-accent-config: (
         'preferred': v.$ds-type-size-18
       ),
       'weight': v.$ds-basic-type-weight-accent2,
-      'letter-spacing': v.$ds-basic-type-letter-spacing-accent,
       'line-height': v.$ds-basic-type-line-height-accent
     ),
     'xs': (
@@ -60,7 +55,6 @@ $hawaiian-type-accent-config: (
         'preferred': v.$ds-type-size-16
       ),
       'weight': v.$ds-basic-type-weight-accent2,
-      'letter-spacing': v.$ds-basic-type-letter-spacing-accent2,
       'line-height': v.$ds-basic-type-line-height-accent
     ),
     '2xs': (
@@ -70,7 +64,6 @@ $hawaiian-type-accent-config: (
         'preferred': v.$ds-type-size-14
       ),
       'weight': v.$ds-basic-type-weight-accent,
-      'letter-spacing': v.$ds-basic-type-letter-spacing-accent2,
       'line-height': v.$ds-basic-type-line-height-accent
     )
   )
diff --git a/src/config/hawaiian/type/body.scss b/src/config/hawaiian/type/body.scss
index 53033d5..8a86cfa 100644
--- a/src/config/hawaiian/type/body.scss
+++ b/src/config/hawaiian/type/body.scss
@@ -2,28 +2,57 @@
 $hawaiian-type-body-config: (
   'family': v.$ds-basic-type-family-body,
   'familyFallback': v.$ds-basic-type-family-body-fallback,
-  'weight': v.$ds-basic-type-weight-body,
   'letter-spacing': v.$ds-basic-type-letter-spacing-body,
   'sizes': (
     'default': (
       'font-size': v.$ds-type-size-16,
-      'line-height': v.$ds-basic-type-line-height-body2
+      'line-height': v.$ds-basic-type-line-height-body2,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    'default-emphasized': (
+      'font-size': v.$ds-type-size-16,
+      'line-height': v.$ds-basic-type-line-height-body2,
+      'weight': v.$ds-basic-type-weight-body2
     ),
     'lg': (
       'font-size': v.$ds-type-size-18,
-      'line-height': v.$ds-basic-type-line-height-body
+      'line-height': v.$ds-basic-type-line-height-body,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    'lg-emphasized': (
+      'font-size': v.$ds-type-size-18,
+      'line-height': v.$ds-basic-type-line-height-body,
+      'weight': v.$ds-basic-type-weight-body2
     ),
     'sm': (
       'font-size': v.$ds-type-size-14,
-      'line-height': v.$ds-basic-type-line-height-body3
+      'line-height': v.$ds-basic-type-line-height-body3,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    'sm-emphasized': (
+      'font-size': v.$ds-type-size-14,
+      'line-height': v.$ds-basic-type-line-height-body3,
+      'weight': v.$ds-basic-type-weight-body2
     ),
     'xs': (
       'font-size': v.$ds-type-size-12,
-      'line-height': v.$ds-basic-type-line-height-body4
+      'line-height': v.$ds-basic-type-line-height-body4,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    'xs-emphasized': (
+      'font-size': v.$ds-type-size-12,
+      'line-height': v.$ds-basic-type-line-height-body4,
+      'weight': v.$ds-basic-type-weight-body2
     ),
     '2xs': (
       'font-size': v.$ds-type-size-10,
-      'line-height': v.$ds-basic-type-line-height-body5
+      'line-height': v.$ds-basic-type-line-height-body5,
+      'weight': v.$ds-basic-type-weight-body
+    ),
+    '2xs-emphasized': (
+      'font-size': v.$ds-type-size-10,
+      'line-height': v.$ds-basic-type-line-height-body5,
+      'weight': v.$ds-basic-type-weight-body2
     )
   )
 );
diff --git a/src/config/hawaiian/type/heading.scss b/src/config/hawaiian/type/heading.scss
index c79153e..7a2fc1d 100644
--- a/src/config/hawaiian/type/heading.scss
+++ b/src/config/hawaiian/type/heading.scss
@@ -11,7 +11,7 @@ $hawaiian-type-heading-config: (
         'max': v.$ds-type-size-40,
         'preferred': v.$ds-type-size-36
       ),
-      'weight': v.$ds-basic-type-weight-heading
+      'weight': v.$ds-basic-type-weight-heading2
     ),
     'lg': (
       'font-size': (
@@ -19,7 +19,7 @@ $hawaiian-type-heading-config: (
         'max': v.$ds-type-size-36,
         'preferred': v.$ds-type-size-32
       ),
-      'weight': v.$ds-basic-type-weight-heading
+      'weight': v.$ds-basic-type-weight-heading2
     ),
     'md': (
       'font-size': (
diff --git a/src/fonts/themes/_alaska.scss b/src/fonts/themes/_alaska.scss
index 0194372..0306298 100644
--- a/src/fonts/themes/_alaska.scss
+++ b/src/fonts/themes/_alaska.scss
@@ -22,6 +22,8 @@
 	@include font-face-i18n($ds-basic-type-brand-family-primary, $ds-type-weight-light, $i18n-font-jp-300-path, $unicode-range-jp);
 	// AS Circular 450 Book -> Noto Sans JP 400
 	@include font-face-i18n($ds-basic-type-brand-family-primary, $ds-type-weight-book, $i18n-font-jp-400-path, $unicode-range-jp);
+	// AS Circular 500 Medium -> Noto Sans JP 500
+	@include font-face-i18n($ds-basic-type-brand-family-primary, $ds-type-weight-medium, $i18n-font-jp-500-path, $unicode-range-jp);
 	// Good OT 450 Cond News -> Noto Sans JP 400
 	@include font-face-i18n($ds-basic-type-brand-family-secondary, $ds-type-weight-cond-news, $i18n-font-jp-400-path, $unicode-range-jp);
 	// Good OT 500 Cond Medium -> Noto Sans JP 500
@@ -32,6 +34,8 @@
 	@include font-face-i18n($ds-basic-type-brand-family-primary, $ds-type-weight-light, $i18n-font-kr-300-path, $unicode-range-kr);
 	// AS Circular 450 Book -> Noto Sans KR 400
 	@include font-face-i18n($ds-basic-type-brand-family-primary, $ds-type-weight-book, $i18n-font-kr-400-path, $unicode-range-kr);
+	// AS Circular 500 Medium -> Noto Sans KR 500
+	@include font-face-i18n($ds-basic-type-brand-family-primary, $ds-type-weight-medium, $i18n-font-kr-500-path, $unicode-range-kr);
 	// Good OT 450 Cond News -> Noto Sans KR 400
 	@include font-face-i18n($ds-basic-type-brand-family-secondary, $ds-type-weight-cond-news, $i18n-font-kr-400-path, $unicode-range-kr);
 	// Good OT 500 Cond Medium -> Noto Sans KR 500
diff --git a/src/type/mixins/_fluid-type.scss b/src/type/mixins/_fluid-type.scss
index eae3817..ad5edb6 100644
--- a/src/type/mixins/_fluid-type.scss
+++ b/src/type/mixins/_fluid-type.scss
@@ -12,7 +12,7 @@
     --#{$css-ns}-#{$type}-#{$size}-letter-spacing: #{type-property-check($theme-config, $size, 'letter-spacing')};
     --#{$css-ns}-#{$type}-#{$size}-weight: #{type-property-check($theme-config, $size, 'weight')};
     --#{$css-ns}-#{$type}-#{$size}-line-height: #{type-property-check($theme-config, $size, 'line-height')};
-    
+
     // Get min, preferred and max values from the config
     $min-size: auro_map-deep-get($theme-config, 'sizes', $size, 'font-size', 'min');
     $preferred-size: auro_map-deep-get($theme-config, 'sizes', $size, 'font-size', 'preferred');
@@ -23,31 +23,33 @@
 }
 
 // Generate classes for fluid type
-@mixin generate-fluid-type-classes($type, $sizes, $use-fallback: false, $fallback-config: null) {
+@mixin generate-fluid-type-classes($type, $sizes, $use-fallback: false, $fallback-config: null, $use-letter-spacing: true) {
   @each $size in $sizes {
     .#{$type}-#{$size} {
       @if $use-fallback and $fallback-config != null {
         // Use CSS fallback
         font-family: var(--#{$css-ns}-#{$type}-#{$size}-family, #{type-property-check($fallback-config, $size, 'family')}), var(--#{$css-ns}-#{$type}-#{$size}-family-fallback, #{type-property-check($fallback-config, $size, 'familyFallback')});
-        letter-spacing: var(--#{$css-ns}-#{$type}-#{$size}-letter-spacing, #{type-property-check($fallback-config, $size, 'letter-spacing')});
         font-weight: var(--#{$css-ns}-#{$type}-#{$size}-weight, #{type-property-check($fallback-config, $size, 'weight')});
         line-height: var(--#{$css-ns}-#{$type}-#{$size}-line-height, #{type-property-check($fallback-config, $size, 'line-height')});
-        
-        // For font-size, generate clamp function as fallback
-        $min-size: auro_map-deep-get($fallback-config, 'sizes', $size, 'font-size', 'min');
-        $preferred-size: auro_map-deep-get($fallback-config, 'sizes', $size, 'font-size', 'preferred');
-        $max-size: auro_map-deep-get($fallback-config, 'sizes', $size, 'font-size', 'max');
-        $clamp-value: calculate-fluid-clamp($min-size, $preferred-size, $max-size);
-        font-size: var(--#{$css-ns}-#{$type}-#{$size}-font-size, #{$clamp-value});
+        font-size: var(--#{$css-ns}-#{$type}-#{$size}-font-size, #{calculate-fluid-clamp(
+          auro_map-deep-get($fallback-config, 'sizes', $size, 'font-size', 'min'),
+          auro_map-deep-get($fallback-config, 'sizes', $size, 'font-size', 'preferred'),
+          auro_map-deep-get($fallback-config, 'sizes', $size, 'font-size', 'max')
+        )});
+
+        @if $use-letter-spacing {
+          letter-spacing: var(--#{$css-ns}-#{$type}-#{$size}-letter-spacing, #{type-property-check($fallback-config, $size, 'letter-spacing')});
+        }
       } @else {
         font-family: var(--#{$css-ns}-#{$type}-#{$size}-family), var(--#{$css-ns}-#{$type}-#{$size}-family-fallback);
-        letter-spacing: var(--#{$css-ns}-#{$type}-#{$size}-letter-spacing);
         font-weight: var(--#{$css-ns}-#{$type}-#{$size}-weight);
         line-height: var(--#{$css-ns}-#{$type}-#{$size}-line-height);
         font-size: var(--#{$css-ns}-#{$type}-#{$size}-font-size);
+
+        @if $use-letter-spacing {
+          letter-spacing: var(--#{$css-ns}-#{$type}-#{$size}-letter-spacing);
+        }
       }
-      
-      // Include any additional content passed to the mixin
       @content;
     }
   }
diff --git a/src/type/mixins/_theme-generator.scss b/src/type/mixins/_theme-generator.scss
index 5b8d3af..a37f142 100644
--- a/src/type/mixins/_theme-generator.scss
+++ b/src/type/mixins/_theme-generator.scss
@@ -5,7 +5,14 @@
 @import "../mixins/type-generator";
 
 // Theme generator
-@mixin generate-theme($theme-name, $body-config, $display-config, $heading-config, $accent-config) {
+@mixin generate-theme(
+  $theme-name,
+  $body-config,
+  $display-config,
+  $heading-config,
+  $accent-config,
+  $accent-uses-letter-spacing: true
+) {
   // Map of all type configs for the theme
   $theme-configs: (
     'body': $body-config,
@@ -13,10 +20,10 @@
     'heading': $heading-config,
     'accent': $accent-config
   );
-  
+
   // Generate CSS variables for the theme
   @include generate-theme-type-css-vars($theme-configs);
-  
+
   // Generate theme type classes
-  @include generate-theme-type-classes();
+  @include generate-theme-type-classes($accent-use-letter-spacing: $accent-uses-letter-spacing);
 }
diff --git a/src/type/mixins/_type-generator.scss b/src/type/mixins/_type-generator.scss
index 36cbd76..3eee9af 100644
--- a/src/type/mixins/_type-generator.scss
+++ b/src/type/mixins/_type-generator.scss
@@ -14,9 +14,9 @@
 }
 
 // Generate theme type classes
-@mixin generate-theme-type-classes($use-fallback: false, $fallback-configs: null) {
+@mixin generate-theme-type-classes($use-fallback: false, $fallback-configs: null, $accent-use-letter-spacing: true) {
   @include generate-body-classes($use-fallback, if($fallback-configs != null, map-get($fallback-configs, 'body'), null));
   @include generate-display-classes($use-fallback, if($fallback-configs != null, map-get($fallback-configs, 'display'), null));
   @include generate-heading-classes($use-fallback, if($fallback-configs != null, map-get($fallback-configs, 'heading'), null));
-  @include generate-accent-classes($use-fallback, if($fallback-configs != null, map-get($fallback-configs, 'accent'), null));
+  @include generate-accent-classes($use-fallback, if($fallback-configs != null, map-get($fallback-configs, 'accent'), null), $accent-use-letter-spacing);
 }
diff --git a/src/type/partials/_accent.scss b/src/type/partials/_accent.scss
index 6ce6dc6..6ddd52b 100644
--- a/src/type/partials/_accent.scss
+++ b/src/type/partials/_accent.scss
@@ -8,8 +8,8 @@ $accent-sizes: ('2xl', 'xl', 'lg', 'md', 'sm', 'xs', '2xs');
 }
 
 // Generate Accent classes
-@mixin generate-accent-classes($use-fallback: false, $fallback-config: null) {
-  @include generate-fluid-type-classes('accent', $accent-sizes, $use-fallback, $fallback-config) {
+@mixin generate-accent-classes($use-fallback: false, $fallback-config: null, $use-letter-spacing: true) {
+  @include generate-fluid-type-classes('accent', $accent-sizes, $use-fallback, $fallback-config, $use-letter-spacing) {
     text-transform: uppercase;
   }
 }
diff --git a/src/type/partials/_body.scss b/src/type/partials/_body.scss
index 136a553..b1b36cd 100644
--- a/src/type/partials/_body.scss
+++ b/src/type/partials/_body.scss
@@ -3,16 +3,22 @@
 @import '../../utilityFunctions/map-deep-get';
 @import '../../utilityVariables/cssNamespace';
 
-$body-sizes: ('default', 'lg', 'sm', 'xs', '2xs');
+$body-base-sizes: ('default', 'lg', 'sm', 'xs', '2xs');
+
+$body-sizes: ();
+@each $size in $body-base-sizes {
+  $body-sizes: append($body-sizes, $size);
+  $body-sizes: append($body-sizes, '#{$size}-emphasized');
+}
 
 // Generate CSS custom properties for Body
 @mixin generate-body-css-vars($theme-config) {
   --#{$css-ns}-body-family: #{map-get($theme-config, 'family')};
   --#{$css-ns}-body-family-fallback: #{map-get($theme-config, 'familyFallback')};
-  --#{$css-ns}-body-weight: #{map-get($theme-config, 'weight')};
   --#{$css-ns}-body-letter-spacing: #{map-get($theme-config, 'letter-spacing')};
 
   @each $size in $body-sizes {
+    --#{$css-ns}-body-#{$size}-weight: #{auro_map-deep-get($theme-config, 'sizes', $size, 'weight')};
     --#{$css-ns}-body-#{$size}-font-size: #{auro_map-deep-get($theme-config, 'sizes', $size, 'font-size')};
     --#{$css-ns}-body-#{$size}-line-height: #{auro_map-deep-get($theme-config, 'sizes', $size, 'line-height')};
   }
@@ -25,13 +31,13 @@ $body-sizes: ('default', 'lg', 'sm', 'xs', '2xs');
       @if $use-fallback and $fallback-config != null {
         // Use CSS fallback
         font-family: var(--#{$css-ns}-body-family, auro_map-deep-get($fallback-config, 'family')), auro_map-deep-get($fallback-config, 'familyFallback');
-        font-weight: var(--#{$css-ns}-body-weight, auro_map-deep-get($fallback-config, 'weight'));
+        font-weight: var(--#{$css-ns}-body-#{$size}-weight, auro_map-deep-get($fallback-config, 'weight'));
         letter-spacing: var(--#{$css-ns}-body-letter-spacing, auro_map-deep-get($fallback-config, 'letter-spacing'));
         font-size: var(--#{$css-ns}-body-#{$size}-font-size, auro_map-deep-get($fallback-config, 'sizes', $size, 'font-size'));
         line-height: var(--#{$css-ns}-body-#{$size}-line-height, auro_map-deep-get($fallback-config, 'sizes', $size, 'line-height'));
       } @else {
         font-family: var(--#{$css-ns}-body-family), var(--#{$css-ns}-body-family-fallback);
-        font-weight: var(--#{$css-ns}-body-weight);
+        font-weight: var(--#{$css-ns}-body-#{$size}-weight);
         letter-spacing: var(--#{$css-ns}-body-letter-spacing);
         font-size: var(--#{$css-ns}-body-#{$size}-font-size);
         line-height: var(--#{$css-ns}-body-#{$size}-line-height);
diff --git a/src/type/themes/hawaiian/index.scss b/src/type/themes/hawaiian/index.scss
index afaac0f..b063b6c 100644
--- a/src/type/themes/hawaiian/index.scss
+++ b/src/type/themes/hawaiian/index.scss
@@ -6,5 +6,6 @@
   $hawaiian-type-body-config,
   $hawaiian-type-display-config,
   $hawaiian-type-heading-config,
-  $hawaiian-type-accent-config
+  $hawaiian-type-accent-config,
+  $accent-uses-letter-spacing: false
 );
