@sage/design-tokens 15.1.0 → 15.2.1

package/js/es6/frozenproduct/small/light/components/progress.js

@@ -39,21 +39,21 @@ export const progressSizeStepindicatorStepcircleS = 24;
 export const progressSizeStepindicatorStepcircleM = 32;
 export const progressColorBgSkeleton =
   "linear-gradient(135deg, #6F6F6F5c 0%, #6F6F6F0A 100%)";
-export const progressColorBgDefault = "#00000014";
-export const progressColorBorderDefault = "#a6a6a6";
+export const progressColorBgDefault = "#cad3d9";
+export const progressColorBorderDefault = "#335B70";
 export const progressColorFgAi =
   "linear-gradient(90deg, #13A038 0%, #149197 40%, #A87CFB 90%)";
 export const progressColorFgAlt = "#00811F";
 export const progressColorFgAlt2 = "#000000ab";
 export const progressColorFgCaution = "#D64309";
-export const progressColorFgDefault = "#000000";
+export const progressColorFgDefault = "#335B70";
 export const progressColorFgError = "#CD384B";
 export const progressColorFgInfo = "#0060A7";
 export const progressColorLabelAlt = "#000000ab";
 export const progressColorLabelDefault = "#000000f2";
 export const progressColorDatavisFgDefault = "#007C7B";
-export const progressColorLoaderBgDefault = "#00000014";
-export const progressColorLoaderFgDefault = "#000000";
+export const progressColorLoaderBgDefault = "#00804614";
+export const progressColorLoaderFgDefault = "#008046";
 export const progressColorLoaderFgError = "#CD384B";
 export const progressColorLoaderFgComplete = "#00811F";
 export const progressColorLoaderInverseBgDefault = "#ffffff14";

package/js/es6/frozenproduct/small/light/components/status.js

@@ -12,24 +12,24 @@ export const statusColorMessageContextualIcon = "#FFFFFF";
 export const statusColorMessageContextualIconAlt = "#656565";
 export const statusColorMessageContextualText = "#000000";
 export const statusColorMessageContextualAiBgDefault = "#000000";
-export const statusColorMessageContextualAiBgAlt = "#efefef";
+export const statusColorMessageContextualAiBgAlt = "#fff0";
 export const statusColorMessageContextualAiBorderDefault = "#000000";
 export const statusColorMessageContextualCalloutBgAlt = "#e5fae2";
 export const statusColorMessageContextualCalloutIcon = "#000000f2";
 export const statusColorMessageContextualErrorBgDefault = "#CD384B";
-export const statusColorMessageContextualErrorBgAlt = "#fdeceb";
+export const statusColorMessageContextualErrorBgAlt = "#fff0";
 export const statusColorMessageContextualErrorBorderDefault = "#CD384B";
 export const statusColorMessageContextualErrorIcon = "#CD384B";
 export const statusColorMessageContextualInfoBgDefault = "#0060A7";
-export const statusColorMessageContextualInfoBgAlt = "#eaeef6";
+export const statusColorMessageContextualInfoBgAlt = "#fff0";
 export const statusColorMessageContextualInfoBorderDefault = "#0060A7";
 export const statusColorMessageContextualInfoIcon = "#0060A7";
 export const statusColorMessageContextualSuccessBgDefault = "#00811F";
-export const statusColorMessageContextualSuccessBgAlt = "#e9f2e8";
+export const statusColorMessageContextualSuccessBgAlt = "#fff0";
 export const statusColorMessageContextualSuccessBorderDefault = "#00811F";
 export const statusColorMessageContextualSuccessIcon = "#00811F";
 export const statusColorMessageContextualWarningBgDefault = "#D64309";
-export const statusColorMessageContextualWarningBgAlt = "#ffede5";
+export const statusColorMessageContextualWarningBgAlt = "#fff0";
 export const statusColorMessageContextualWarningBorderDefault = "#D64309";
 export const statusColorMessageContextualWarningIcon = "#D64309";
 export const statusColorMessageGlobalLabelDefault = "#000000f2";
@@ -37,12 +37,12 @@ export const statusColorMessageGlobalLabelHover = "#000000";
 export const statusColorMessageGlobalCalloutBgDefault = "#e5fae2";
 export const statusColorMessageGlobalCalloutBgHover = "#d8ecd5";
 export const statusColorMessageGlobalCalloutIcon = "#000000f2";
-export const statusColorMessageGlobalInfoBgDefault = "#eaeef6";
-export const statusColorMessageGlobalInfoBgHover = "#cdd7ea";
-export const statusColorMessageGlobalInfoIcon = "#0060A7";
-export const statusColorMessageGlobalWarningBgDefault = "#ffede5";
-export const statusColorMessageGlobalWarningBgHover = "#fed5c3";
-export const statusColorMessageGlobalWarningIcon = "#D64309";
+export const statusColorMessageGlobalInfoBgDefault = "#65a9ff";
+export const statusColorMessageGlobalInfoBgHover = "#82b5ff";
+export const statusColorMessageGlobalInfoIcon = "#000000f2";
+export const statusColorMessageGlobalWarningBgDefault = "#ff8629";
+export const statusColorMessageGlobalWarningBgHover = "#ff994c";
+export const statusColorMessageGlobalWarningIcon = "#000000f2";
 export const statusColorPillCustomBlueBgDefault = "#0071C3";
 export const statusColorPillCustomBlueBgAltDefault = "#ebf0f9";
 export const statusColorPillCustomBlueBgAltHover = "#ced9ed";
@@ -94,7 +94,7 @@ export const statusColorPillCustomSlateBgAltHover = "#cbdae6";
 export const statusColorPillCustomSlateBgHover = "#466171";
 export const statusColorPillCustomSlateBorderDefault = "#527386";
 export const statusColorPillErrorBgDefault = "#CD384B";
-export const statusColorPillErrorBgAltDefault = "#fdeceb";
+export const statusColorPillErrorBgAltDefault = "#fff0";
 export const statusColorPillErrorBgAltHover = "#f9d3d1";
 export const statusColorPillErrorBgHover = "#ac3240";
 export const statusColorPillErrorBorderDefault = "#CD384B";
@@ -122,7 +122,7 @@ export const statusColorPillImportantInverseBgAltHover = "#282039";
 export const statusColorPillImportantInverseBgHover = "#a977e2";
 export const statusColorPillImportantInverseBorderDefault = "#985FDC";
 export const statusColorPillInfoBgDefault = "#0060A7";
-export const statusColorPillInfoBgAltDefault = "#eaeef6";
+export const statusColorPillInfoBgAltDefault = "#fff0";
 export const statusColorPillInfoBgAltHover = "#cdd7ea";
 export const statusColorPillInfoBgHover = "#10518c";
 export const statusColorPillInfoBorderDefault = "#0060A7";
@@ -131,11 +131,11 @@ export const statusColorPillInfoInverseBgAltDefault = "#111722";
 export const statusColorPillInfoInverseBgAltHover = "#17253a";
 export const statusColorPillInfoInverseBgHover = "#4f90df";
 export const statusColorPillInfoInverseBorderDefault = "#007ED9";
-export const statusColorPillNeutralBgDefault = "#656565";
-export const statusColorPillNeutralBgAltDefault = "#efefef";
-export const statusColorPillNeutralBgAltHover = "#d9d9d9";
-export const statusColorPillNeutralBgHover = "#565656";
-export const statusColorPillNeutralBorderDefault = "#656565";
+export const statusColorPillNeutralBgDefault = "#335B70";
+export const statusColorPillNeutralBgAltDefault = "#fff0";
+export const statusColorPillNeutralBgAltHover = "#dde0e2";
+export const statusColorPillNeutralBgHover = "#20313b";
+export const statusColorPillNeutralBorderDefault = "#335B70";
 export const statusColorPillNeutralInverseBgDefault = "#7C7C7C";
 export const statusColorPillNeutralInverseBgAltDefault = "#171717";
 export const statusColorPillNeutralInverseBgAltHover = "#242424";
@@ -145,7 +145,7 @@ export const statusColorPillReadonlyBgDefault = "#a6a6a6";
 export const statusColorPillReadonlyBorderDefault = "#a6a6a6";
 export const statusColorPillReadonlyLabel = "#000000ab";
 export const statusColorPillSuccessBgDefault = "#00811F";
-export const statusColorPillSuccessBgAltDefault = "#e9f2e8";
+export const statusColorPillSuccessBgAltDefault = "#fff0";
 export const statusColorPillSuccessBgAltHover = "#cbe1c9";
 export const statusColorPillSuccessBgHover = "#0e6d1d";
 export const statusColorPillSuccessBorderDefault = "#00811F";
@@ -155,7 +155,7 @@ export const statusColorPillSuccessInverseBgAltHover = "#132912";
 export const statusColorPillSuccessInverseBgHover = "#328e37";
 export const statusColorPillSuccessInverseBorderDefault = "#009023";
 export const statusColorPillWarningBgDefault = "#D64309";
-export const statusColorPillWarningBgAltDefault = "#ffede5";
+export const statusColorPillWarningBgAltDefault = "#fff0";
 export const statusColorPillWarningBgAltHover = "#fed5c3";
 export const statusColorPillWarningBgHover = "#b33b0d";
 export const statusColorPillWarningBorderDefault = "#D64309";
@@ -164,11 +164,11 @@ export const statusColorPillWarningInverseBgAltDefault = "#251206";
 export const statusColorPillWarningInverseBgAltHover = "#3e1a0b";
 export const statusColorPillWarningInverseBgHover = "#eb6530";
 export const statusColorPillWarningInverseBorderDefault = "#E04500";
-export const statusColorRatingBgDefault = "#00811F";
+export const statusColorRatingBgDefault = "#008046";
 export const statusColorRatingBgDefaultAlt =
-  "linear-gradient(90deg, #00811F 0%, #00811F 50%, #d1d1d1 50%, #d1d1d1 100%)";
-export const statusColorRatingBgHover = "#0e6d1d";
-export const statusColorRatingBorderDefault = "#00811F";
+  "linear-gradient(90deg, #008046 0%, #008046 50%, #d1d1d1 50%, #d1d1d1 100%)";
+export const statusColorRatingBgHover = "#0d6c3c";
+export const statusColorRatingBorderDefault = "#008046";
 export const statusSizePillS = 20;
 export const statusSizePillM = 24;
 export const statusSizePillL = 28;
@@ -179,7 +179,7 @@ export const statusSizeMessageGlobalM = 40;
 export const statusSizeIconM = 20;
 export const statusRadiusNone = "0";
 export const statusRadiusMessage = 8;
-export const statusRadiusPill = 6;
+export const statusRadiusPill = 2;
 export const statusBorderwidthPill = 2;
 export const statusBorderwidthMessage = 1;
 export const statusSpaceNone = 0;

package/js/es6/frozenproduct/small/light/components/tab.js

@@ -23,11 +23,11 @@ export const tabSpaceYM = 8;
 export const tabSpaceYL = 12;
 export const tabColorBgActive = "#FFFFFF";
 export const tabColorBgEnabled = "#fff0";
-export const tabColorBgHover = "#0000001a";
+export const tabColorBgHover = "#2237431a";
 export const tabColorBorderActivealt = "#d1d1d1";
-export const tabColorBorderActive = "#000000";
-export const tabColorBorderEnabled = "#d1d1d1";
-export const tabColorBorderHover = "#777";
+export const tabColorBorderActive = "#008046";
+export const tabColorBorderEnabled = "#2237431a";
+export const tabColorBorderHover = "#2237431a";
 export const tabColorIconEnabled = "#000000ab";
 export const tabColorIconHover = "#000000";
 export const tabColorLabelActive = "#000000";
@@ -41,8 +41,8 @@ export const tabColorValidationIconError = "#CD384B";
 export const tabColorValidationIconWarning = "#D64309";
 export const tabColorValidationLabelError = "#000000ab";
 export const tabColorValidationLabelWarning = "#000000ab";
-export const tabRadiusM = 8;
-export const tabRadiusL = 8;
+export const tabRadiusM = 4;
+export const tabRadiusL = 4;
 export const tabRadiusBaselineM = 1;
 export const tabRadiusBaselineL = 1;
 export const tabRadiusIndicatorM = 2;

package/js/es6/frozenproduct/small/light/components/table.js

@@ -12,22 +12,22 @@ export const tableColorHeaderSubtleBgHover = "#00000026";
 export const tableColorHeaderSubtleBorderDefault = "#d1d1d1";
 export const tableColorHeaderSubtleLabelDefault = "#000000e6";
 export const tableColorHeaderSubtleLabelHover = "#000000e6";
-export const tableColorHeaderHarshBgAlt = "#000000e6";
-export const tableColorHeaderHarshBgDefault = "#000000ab";
+export const tableColorHeaderHarshBgAlt = "#476a7d";
+export const tableColorHeaderHarshBgDefault = "#335B70";
 export const tableColorHeaderHarshBgHover = "#00000026";
 export const tableColorHeaderHarshBorderDefault = "#a6a6a6";
 export const tableColorHeaderHarshLabelDefault = "#FFFFFF";
 export const tableColorHeaderHarshLabelHover = "#000000e6";
-export const tableColorRowBgActivated = "#00811F";
-export const tableColorRowBgActive = "#000000";
+export const tableColorRowBgActivated = "#9badb8";
+export const tableColorRowBgActive = "#22374326";
 export const tableColorRowBgDefault = "#FFFFFF";
-export const tableColorRowBgAlt = "#e8e8e8";
+export const tableColorRowBgAlt = "#fbfbfc";
 export const tableColorRowBgAlt2 = "#dedede";
 export const tableColorRowBgAlt3 = "#f3f3f3";
-export const tableColorRowBgHover = "#dedede";
+export const tableColorRowBgHover = "#f2f4f6";
 export const tableColorRowBorderDefault = "#d1d1d1";
-export const tableColorRowLabelActivated = "#FFFFFF";
-export const tableColorRowLabelActive = "#FFFFFF";
+export const tableColorRowLabelActivated = "#000000";
+export const tableColorRowLabelActive = "#000000";
 export const tableColorRowLabelDefault = "#000000f2";
 export const tableColorRowLabelHover = "#000000";
 export const tableColorFooterBgDefault = "#dedede";

package/js/es6/frozenproduct/small/light/mode.d.ts

@@ -116,6 +116,7 @@ export const modesColorInteractiveMonochromeActiveAlt: string;
 export const modesColorInteractiveMonochromeDefault: string;
 export const modesColorInteractiveMonochromeDefaultAlt: string;
 export const modesColorInteractiveMonochromeDefaultAlt2: string;
+export const modesColorInteractiveMonochromeDefaultAlt3: string;
 export const modesColorInteractiveMonochromeHoverAlt: string;
 export const modesColorInteractiveMonochromeHover: string;
 export const modesColorInteractiveMonochromeWithActive: string;

package/js/es6/frozenproduct/small/light/mode.js

@@ -119,7 +119,8 @@ export const modesColorInteractiveMonochromeActive = "#000000";
 export const modesColorInteractiveMonochromeActiveAlt = "#00000026";
 export const modesColorInteractiveMonochromeDefault = "#000000e6";
 export const modesColorInteractiveMonochromeDefaultAlt = "#000000ab";
-export const modesColorInteractiveMonochromeDefaultAlt2 = "#0000006b";
+export const modesColorInteractiveMonochromeDefaultAlt2 = "#0000008c";
+export const modesColorInteractiveMonochromeDefaultAlt3 = "#0000006b";
 export const modesColorInteractiveMonochromeHoverAlt = "#0000001a";
 export const modesColorInteractiveMonochromeHover = "#00000026";
 export const modesColorInteractiveMonochromeWithActive = "#FFFFFF";

package/js/es6/product/large/dark/components/form.d.ts

@@ -212,6 +212,7 @@ export const formColorDropdownLabelAlt: string;
 export const formColorDropdownLabelDisabled: string;
 export const formColorDropdownLabelEnabled: string;
 export const formColorDropdownLabelHover: string;
+export const formColorDropdownLabelSubtext: string;
 export const formColorLabelsetLabelRequired: string;
 export const formColorLabelsetLabelDefault: string;
 export const formColorLabelsetLabelAlt: string;
@@ -322,6 +323,13 @@ export const formTypographyAdaptiveLabelL: {
   fontSize: string;
   paragraphSpacing: string;
 };
+export const formTypographyAdaptiveDefaultXs: {
+  fontFamily: string;
+  fontWeight: string;
+  lineHeight: number;
+  fontSize: string;
+  paragraphSpacing: string;
+};
 export const formTypographyAdaptiveDefaultS: {
   fontFamily: string;
   fontWeight: string;
@@ -364,6 +372,13 @@ export const formTypographyResponsiveLabelL: {
   fontSize: string;
   paragraphSpacing: string;
 };
+export const formTypographyResponsiveDefaultXs: {
+  fontFamily: string;
+  fontWeight: string;
+  lineHeight: number;
+  fontSize: string;
+  paragraphSpacing: string;
+};
 export const formTypographyResponsiveDefaultS: {
   fontFamily: string;
   fontWeight: string;

package/js/es6/product/large/dark/components/form.js

@@ -212,6 +212,7 @@ export const formColorDropdownLabelAlt = "#ffffffe6";
 export const formColorDropdownLabelDisabled = "#ffffff4d";
 export const formColorDropdownLabelEnabled = "#ffffffab";
 export const formColorDropdownLabelHover = "#FFFFFF";
+export const formColorDropdownLabelSubtext = "#ffffff8c";
 export const formColorLabelsetLabelRequired = "#E13E53";
 export const formColorLabelsetLabelDefault = "#fffffff2";
 export const formColorLabelsetLabelAlt = "#ffffff8c";
@@ -332,6 +333,13 @@ export const formTypographyAdaptiveLabelL = {
   fontSize: "16px",
   paragraphSpacing: "0",
 };
+export const formTypographyAdaptiveDefaultXs = {
+  fontFamily: "Sage UI",
+  fontWeight: "400",
+  lineHeight: 1.5,
+  fontSize: "13px",
+  paragraphSpacing: "0",
+};
 export const formTypographyAdaptiveDefaultS = {
   fontFamily: "Sage UI",
   fontWeight: "400",
@@ -374,6 +382,13 @@ export const formTypographyResponsiveLabelL = {
   fontSize: "clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)",
   paragraphSpacing: "0",
 };
+export const formTypographyResponsiveDefaultXs = {
+  fontFamily: "Sage UI",
+  fontWeight: "400",
+  lineHeight: 1.5,
+  fontSize: "clamp(0.7675rem, 0.8048rem + -0.0465vw, 0.7955rem)",
+  paragraphSpacing: "0",
+};
 export const formTypographyResponsiveDefaultS = {
   fontFamily: "Sage UI",
   fontWeight: "400",

package/js/es6/product/large/dark/mode.d.ts

@@ -116,6 +116,7 @@ export const modesColorInteractiveMonochromeActiveAlt: string;
 export const modesColorInteractiveMonochromeDefault: string;
 export const modesColorInteractiveMonochromeDefaultAlt: string;
 export const modesColorInteractiveMonochromeDefaultAlt2: string;
+export const modesColorInteractiveMonochromeDefaultAlt3: string;
 export const modesColorInteractiveMonochromeHoverAlt: string;
 export const modesColorInteractiveMonochromeHover: string;
 export const modesColorInteractiveMonochromeWithActive: string;

package/js/es6/product/large/dark/mode.js

@@ -119,7 +119,8 @@ export const modesColorInteractiveMonochromeActive = "#FFFFFF";
 export const modesColorInteractiveMonochromeActiveAlt = "#ffffff26";
 export const modesColorInteractiveMonochromeDefault = "#ffffffe6";
 export const modesColorInteractiveMonochromeDefaultAlt = "#ffffffab";
-export const modesColorInteractiveMonochromeDefaultAlt2 = "#ffffff6b";
+export const modesColorInteractiveMonochromeDefaultAlt2 = "#ffffff8c";
+export const modesColorInteractiveMonochromeDefaultAlt3 = "#ffffff6b";
 export const modesColorInteractiveMonochromeHoverAlt = "#ffffff1a";
 export const modesColorInteractiveMonochromeHover = "#ffffff26";
 export const modesColorInteractiveMonochromeWithActive = "#000000";

package/js/es6/product/large/light/components/form.d.ts

@@ -212,6 +212,7 @@ export const formColorDropdownLabelAlt: string;
 export const formColorDropdownLabelDisabled: string;
 export const formColorDropdownLabelEnabled: string;
 export const formColorDropdownLabelHover: string;
+export const formColorDropdownLabelSubtext: string;
 export const formColorLabelsetLabelRequired: string;
 export const formColorLabelsetLabelDefault: string;
 export const formColorLabelsetLabelAlt: string;
@@ -322,6 +323,13 @@ export const formTypographyAdaptiveLabelL: {
   fontSize: string;
   paragraphSpacing: string;
 };
+export const formTypographyAdaptiveDefaultXs: {
+  fontFamily: string;
+  fontWeight: string;
+  lineHeight: number;
+  fontSize: string;
+  paragraphSpacing: string;
+};
 export const formTypographyAdaptiveDefaultS: {
   fontFamily: string;
   fontWeight: string;
@@ -364,6 +372,13 @@ export const formTypographyResponsiveLabelL: {
   fontSize: string;
   paragraphSpacing: string;
 };
+export const formTypographyResponsiveDefaultXs: {
+  fontFamily: string;
+  fontWeight: string;
+  lineHeight: number;
+  fontSize: string;
+  paragraphSpacing: string;
+};
 export const formTypographyResponsiveDefaultS: {
   fontFamily: string;
   fontWeight: string;

package/js/es6/product/large/light/components/form.js

@@ -212,6 +212,7 @@ export const formColorDropdownLabelAlt = "#000000e6";
 export const formColorDropdownLabelDisabled = "#0000006b";
 export const formColorDropdownLabelEnabled = "#000000ab";
 export const formColorDropdownLabelHover = "#000000";
+export const formColorDropdownLabelSubtext = "#0000008c";
 export const formColorLabelsetLabelRequired = "#CD384B";
 export const formColorLabelsetLabelDefault = "#000000f2";
 export const formColorLabelsetLabelAlt = "#0000008c";
@@ -332,6 +333,13 @@ export const formTypographyAdaptiveLabelL = {
   fontSize: "16px",
   paragraphSpacing: "0",
 };
+export const formTypographyAdaptiveDefaultXs = {
+  fontFamily: "Sage UI",
+  fontWeight: "400",
+  lineHeight: 1.5,
+  fontSize: "13px",
+  paragraphSpacing: "0",
+};
 export const formTypographyAdaptiveDefaultS = {
   fontFamily: "Sage UI",
   fontWeight: "400",
@@ -374,6 +382,13 @@ export const formTypographyResponsiveLabelL = {
   fontSize: "clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)",
   paragraphSpacing: "0",
 };
+export const formTypographyResponsiveDefaultXs = {
+  fontFamily: "Sage UI",
+  fontWeight: "400",
+  lineHeight: 1.5,
+  fontSize: "clamp(0.7675rem, 0.8048rem + -0.0465vw, 0.7955rem)",
+  paragraphSpacing: "0",
+};
 export const formTypographyResponsiveDefaultS = {
   fontFamily: "Sage UI",
   fontWeight: "400",

package/js/es6/product/large/light/mode.d.ts

@@ -116,6 +116,7 @@ export const modesColorInteractiveMonochromeActiveAlt: string;
 export const modesColorInteractiveMonochromeDefault: string;
 export const modesColorInteractiveMonochromeDefaultAlt: string;
 export const modesColorInteractiveMonochromeDefaultAlt2: string;
+export const modesColorInteractiveMonochromeDefaultAlt3: string;
 export const modesColorInteractiveMonochromeHoverAlt: string;
 export const modesColorInteractiveMonochromeHover: string;
 export const modesColorInteractiveMonochromeWithActive: string;

package/js/es6/product/large/light/mode.js

@@ -119,7 +119,8 @@ export const modesColorInteractiveMonochromeActive = "#000000";
 export const modesColorInteractiveMonochromeActiveAlt = "#00000026";
 export const modesColorInteractiveMonochromeDefault = "#000000e6";
 export const modesColorInteractiveMonochromeDefaultAlt = "#000000ab";
-export const modesColorInteractiveMonochromeDefaultAlt2 = "#0000006b";
+export const modesColorInteractiveMonochromeDefaultAlt2 = "#0000008c";
+export const modesColorInteractiveMonochromeDefaultAlt3 = "#0000006b";
 export const modesColorInteractiveMonochromeHoverAlt = "#0000001a";
 export const modesColorInteractiveMonochromeHover = "#00000026";
 export const modesColorInteractiveMonochromeWithActive = "#FFFFFF";

package/js/es6/product/small/dark/components/button.js

@@ -24,32 +24,32 @@ export const buttonSpaceNone = "0";
 export const buttonSpaceBarIconbuttonXInnerM = 10;
 export const buttonSpaceBarIconbuttonXInnerL = "14px";
 export const buttonSpaceBarIconbuttonXOuterM = "14px";
-export const buttonSpaceBarIconbuttonXOuterL = 16;
-export const buttonSpaceFabChildXM = 6.4;
-export const buttonSpaceFabChildXL = 12.8;
-export const buttonSpaceFabParentXM = 12.8;
+export const buttonSpaceBarIconbuttonXOuterL = 20;
+export const buttonSpaceFabChildXM = 8;
+export const buttonSpaceFabChildXL = 16;
+export const buttonSpaceFabParentXM = 16;
 export const buttonSpaceFabParentXgM = 12;
-export const buttonSpaceFabParentYM = 12.8;
-export const buttonSpaceLayoutXXs = 6.4;
-export const buttonSpaceLayoutXS = 12.8;
-export const buttonSpaceLayoutXM = 19.2;
-export const buttonSpaceLayoutXL = 25.6;
-export const buttonSpaceLayoutYXs = 6.4;
-export const buttonSpaceLayoutYS = 12.8;
-export const buttonSpaceLayoutYM = 19.2;
-export const buttonSpaceLayoutYL = 25.6;
-export const buttonSpaceLayoutXgS = 6.4;
+export const buttonSpaceFabParentYM = 16;
+export const buttonSpaceLayoutXXs = 8;
+export const buttonSpaceLayoutXS = 16;
+export const buttonSpaceLayoutXM = 24;
+export const buttonSpaceLayoutXL = 32;
+export const buttonSpaceLayoutYXs = 8;
+export const buttonSpaceLayoutYS = 16;
+export const buttonSpaceLayoutYM = 24;
+export const buttonSpaceLayoutYL = 32;
+export const buttonSpaceLayoutXgS = 8;
 export const buttonSpaceLayoutXgM = 12;
-export const buttonSpaceLayoutXgL = 12.8;
-export const buttonSpaceLayoutYgS = 6.4;
+export const buttonSpaceLayoutXgL = 16;
+export const buttonSpaceLayoutYgS = 8;
 export const buttonSpaceLayoutYgM = 12;
-export const buttonSpaceLayoutYgL = 12.8;
-export const buttonSpacePrimaryXS = 9.6;
-export const buttonSpacePrimaryXM = 12.8;
-export const buttonSpacePrimaryXL = 16;
-export const buttonSpacePrimaryXgS = 6.4;
-export const buttonSpacePrimaryXgM = 6.4;
-export const buttonSpacePrimaryXgL = 6.4;
+export const buttonSpaceLayoutYgL = 16;
+export const buttonSpacePrimaryXS = 12;
+export const buttonSpacePrimaryXM = 16;
+export const buttonSpacePrimaryXL = 20;
+export const buttonSpacePrimaryXgS = 8;
+export const buttonSpacePrimaryXgM = 8;
+export const buttonSpacePrimaryXgL = 8;
 export const buttonSpacePrimaryYS = 4;
 export const buttonSpacePrimaryYM = 8;
 export const buttonSpacePrimaryYL = 9.5;
@@ -59,18 +59,18 @@ export const buttonSpacePrimaryIcononlyXL = 14;
 export const buttonSpacePrimaryIcononlyYS = 6;
 export const buttonSpacePrimaryIcononlyYM = 10;
 export const buttonSpacePrimaryIcononlyYL = 14;
-export const buttonSpaceSecondaryXXs = 6.4;
+export const buttonSpaceSecondaryXXs = 8;
 export const buttonSpaceSecondaryXS = 12;
-export const buttonSpaceSecondaryXM = 12.8;
-export const buttonSpaceSecondaryXL = 16;
-export const buttonSpaceSecondaryYXs = 1.1;
+export const buttonSpaceSecondaryXM = 16;
+export const buttonSpaceSecondaryXL = 20;
+export const buttonSpaceSecondaryYXs = 1.5;
 export const buttonSpaceSecondaryYS = 4;
 export const buttonSpaceSecondaryYM = 8;
 export const buttonSpaceSecondaryYL = 9.5;
 export const buttonSpaceSecondaryXgXs = 4;
-export const buttonSpaceSecondaryXgS = 6.4;
-export const buttonSpaceSecondaryXgM = 6.4;
-export const buttonSpaceSecondaryXgL = 6.4;
+export const buttonSpaceSecondaryXgS = 8;
+export const buttonSpaceSecondaryXgM = 8;
+export const buttonSpaceSecondaryXgL = 8;
 export const buttonSpaceSecondaryIcononlyXXs = 4;
 export const buttonSpaceSecondaryIcononlyXS = 6;
 export const buttonSpaceSecondaryIcononlyXM = 10;
@@ -79,18 +79,18 @@ export const buttonSpaceSecondaryIcononlyYXs = 4;
 export const buttonSpaceSecondaryIcononlyYS = 6;
 export const buttonSpaceSecondaryIcononlyYM = 10;
 export const buttonSpaceSecondaryIcononlyYL = 14;
-export const buttonSpaceTertiaryYXs = 1.1;
+export const buttonSpaceTertiaryYXs = 1.5;
 export const buttonSpaceTertiaryYS = 4;
 export const buttonSpaceTertiaryYM = 8;
 export const buttonSpaceTertiaryYL = 9.5;
-export const buttonSpaceTertiaryXXs = 6.4;
-export const buttonSpaceTertiaryXS = 9.6;
-export const buttonSpaceTertiaryXM = 12.8;
-export const buttonSpaceTertiaryXL = 16;
+export const buttonSpaceTertiaryXXs = 8;
+export const buttonSpaceTertiaryXS = 12;
+export const buttonSpaceTertiaryXM = 16;
+export const buttonSpaceTertiaryXL = 20;
 export const buttonSpaceTertiaryXgXs = 4;
-export const buttonSpaceTertiaryXgS = 6.4;
-export const buttonSpaceTertiaryXgM = 6.4;
-export const buttonSpaceTertiaryXgL = 6.4;
+export const buttonSpaceTertiaryXgS = 8;
+export const buttonSpaceTertiaryXgM = 8;
+export const buttonSpaceTertiaryXgL = 8;
 export const buttonSpaceTertiaryIcononlyXXs = 4;
 export const buttonSpaceTertiaryIcononlyXS = 6;
 export const buttonSpaceTertiaryIcononlyXM = 10;
@@ -99,14 +99,14 @@ export const buttonSpaceTertiaryIcononlyYXs = 4;
 export const buttonSpaceTertiaryIcononlyYS = 6;
 export const buttonSpaceTertiaryIcononlyYM = 10;
 export const buttonSpaceTertiaryIcononlyYL = 14;
-export const buttonSpaceSubtleYXs = 1.1;
+export const buttonSpaceSubtleYXs = 1.5;
 export const buttonSpaceSubtleYS = 4;
 export const buttonSpaceSubtleYM = 8;
 export const buttonSpaceSubtleYL = 9.5;
-export const buttonSpaceSubtleXXs = 6.4;
-export const buttonSpaceSubtleXS = 6.4;
-export const buttonSpaceSubtleXM = 6.4;
-export const buttonSpaceSubtleXL = 6.4;
+export const buttonSpaceSubtleXXs = 8;
+export const buttonSpaceSubtleXS = 8;
+export const buttonSpaceSubtleXM = 8;
+export const buttonSpaceSubtleXL = 8;
 export const buttonSpaceSubtleXgXs = 4;
 export const buttonSpaceSubtleXgS = 4;
 export const buttonSpaceSubtleXgM = 4;
@@ -119,14 +119,14 @@ export const buttonSpaceSubtleIcononlyYXs = 4;
 export const buttonSpaceSubtleIcononlyYS = 6;
 export const buttonSpaceSubtleIcononlyYM = 10;
 export const buttonSpaceSubtleIcononlyYL = 14;
-export const buttonSpaceToggleButtonXXs = 6.4;
-export const buttonSpaceToggleButtonXS = 9.6;
-export const buttonSpaceToggleButtonXM = 12.8;
-export const buttonSpaceToggleButtonXL = 16;
-export const buttonSpaceToggleButtonXgS = 6.4;
-export const buttonSpaceToggleButtonXgM = 6.4;
-export const buttonSpaceToggleButtonXgL = 6.4;
-export const buttonSpaceToggleButtonYXs = 1.1;
+export const buttonSpaceToggleButtonXXs = 8;
+export const buttonSpaceToggleButtonXS = 12;
+export const buttonSpaceToggleButtonXM = 16;
+export const buttonSpaceToggleButtonXL = 20;
+export const buttonSpaceToggleButtonXgS = 8;
+export const buttonSpaceToggleButtonXgM = 8;
+export const buttonSpaceToggleButtonXgL = 8;
+export const buttonSpaceToggleButtonYXs = 1.5;
 export const buttonSpaceToggleButtonYS = 4;
 export const buttonSpaceToggleButtonYM = 8;
 export const buttonSpaceToggleButtonYL = 9.5;