diff --git a/catalog/src/utils/material-color-helpers.ts b/catalog/src/utils/material-color-helpers.ts
index 775975266c..932041ad11 100644
--- a/catalog/src/utils/material-color-helpers.ts
+++ b/catalog/src/utils/material-color-helpers.ts
@@ -20,43 +20,55 @@ import {applyThemeString} from './apply-theme-string.js';
  * A Mapping of color token name to MCU HCT color function generator.
  */
 const materialColors = {
-  background: MaterialDynamicColors.background,
-  'on-background': MaterialDynamicColors.onBackground,
-  surface: MaterialDynamicColors.surface,
-  'surface-dim': MaterialDynamicColors.surfaceDim,
-  'surface-bright': MaterialDynamicColors.surfaceBright,
-  'surface-container-lowest': MaterialDynamicColors.surfaceContainerLowest,
-  'surface-container-low': MaterialDynamicColors.surfaceContainerLow,
-  'surface-container': MaterialDynamicColors.surfaceContainer,
-  'surface-container-high': MaterialDynamicColors.surfaceContainerHigh,
-  'surface-container-highest': MaterialDynamicColors.surfaceContainerHighest,
-  'on-surface': MaterialDynamicColors.onSurface,
-  'surface-variant': MaterialDynamicColors.surfaceVariant,
-  'on-surface-variant': MaterialDynamicColors.onSurfaceVariant,
-  'inverse-surface': MaterialDynamicColors.inverseSurface,
-  'inverse-on-surface': MaterialDynamicColors.inverseOnSurface,
-  outline: MaterialDynamicColors.outline,
-  'outline-variant': MaterialDynamicColors.outlineVariant,
-  shadow: MaterialDynamicColors.shadow,
-  scrim: MaterialDynamicColors.scrim,
-  'surface-tint': MaterialDynamicColors.surfaceTint,
-  primary: MaterialDynamicColors.primary,
-  'on-primary': MaterialDynamicColors.onPrimary,
-  'primary-container': MaterialDynamicColors.primaryContainer,
-  'on-primary-container': MaterialDynamicColors.onPrimaryContainer,
-  'inverse-primary': MaterialDynamicColors.inversePrimary,
-  secondary: MaterialDynamicColors.secondary,
-  'on-secondary': MaterialDynamicColors.onSecondary,
-  'secondary-container': MaterialDynamicColors.secondaryContainer,
-  'on-secondary-container': MaterialDynamicColors.onSecondaryContainer,
-  tertiary: MaterialDynamicColors.tertiary,
-  'on-tertiary': MaterialDynamicColors.onTertiary,
-  'tertiary-container': MaterialDynamicColors.tertiaryContainer,
-  'on-tertiary-container': MaterialDynamicColors.onTertiaryContainer,
-  error: MaterialDynamicColors.error,
-  'on-error': MaterialDynamicColors.onError,
-  'error-container': MaterialDynamicColors.errorContainer,
-  'on-error-container': MaterialDynamicColors.onErrorContainer,
+  ['background']: MaterialDynamicColors.background,
+  ['error']: MaterialDynamicColors.error,
+  ['error-container']: MaterialDynamicColors.errorContainer,
+  ['inverse-on-surface']: MaterialDynamicColors.inverseOnSurface,
+  ['inverse-primary']: MaterialDynamicColors.inversePrimary,
+  ['inverse-surface']: MaterialDynamicColors.inverseSurface,
+  ['on-background']: MaterialDynamicColors.onBackground,
+  ['on-error']: MaterialDynamicColors.onError,
+  ['on-error-container']: MaterialDynamicColors.onErrorContainer,
+  ['on-primary']: MaterialDynamicColors.onPrimary,
+  ['on-primary-container']: MaterialDynamicColors.onPrimaryContainer,
+  ['on-primary-fixed']: MaterialDynamicColors.onPrimaryFixed,
+  ['on-primary-fixed-variant']: MaterialDynamicColors.onPrimaryFixedVariant,
+  ['on-secondary']: MaterialDynamicColors.onSecondary,
+  ['on-secondary-container']: MaterialDynamicColors.onSecondaryContainer,
+  ['on-secondary-fixed']: MaterialDynamicColors.onSecondaryFixed,
+  ['on-secondary-fixed-variant']: MaterialDynamicColors.onSecondaryFixedVariant,
+  ['on-surface']: MaterialDynamicColors.onSurface,
+  ['on-surface-variant']: MaterialDynamicColors.onSurfaceVariant,
+  ['on-tertiary']: MaterialDynamicColors.onTertiary,
+  ['on-tertiary-container']: MaterialDynamicColors.onTertiaryContainer,
+  ['on-tertiary-fixed']: MaterialDynamicColors.onTertiaryFixed,
+  ['on-tertiary-fixed-variant']: MaterialDynamicColors.onTertiaryFixedVariant,
+  ['outline']: MaterialDynamicColors.outline,
+  ['outline-variant']: MaterialDynamicColors.outlineVariant,
+  ['primary']: MaterialDynamicColors.primary,
+  ['primary-container']: MaterialDynamicColors.primaryContainer,
+  ['primary-fixed']: MaterialDynamicColors.primaryFixed,
+  ['primary-fixed-dim']: MaterialDynamicColors.primaryFixedDim,
+  ['scrim']: MaterialDynamicColors.scrim,
+  ['secondary']: MaterialDynamicColors.secondary,
+  ['secondary-container']: MaterialDynamicColors.secondaryContainer,
+  ['secondary-fixed']: MaterialDynamicColors.secondaryFixed,
+  ['secondary-fixed-dim']: MaterialDynamicColors.secondaryFixedDim,
+  ['shadow']: MaterialDynamicColors.shadow,
+  ['surface']: MaterialDynamicColors.surface,
+  ['surface-bright']: MaterialDynamicColors.surfaceBright,
+  ['surface-container']: MaterialDynamicColors.surfaceContainer,
+  ['surface-container-high']: MaterialDynamicColors.surfaceContainerHigh,
+  ['surface-container-highest']: MaterialDynamicColors.surfaceContainerHighest,
+  ['surface-container-low']: MaterialDynamicColors.surfaceContainerLow,
+  ['surface-container-lowest']: MaterialDynamicColors.surfaceContainerLowest,
+  ['surface-dim']: MaterialDynamicColors.surfaceDim,
+  ['surface-tint']: MaterialDynamicColors.surfaceTint,
+  ['surface-variant']: MaterialDynamicColors.surfaceVariant,
+  ['tertiary']: MaterialDynamicColors.tertiary,
+  ['tertiary-container']: MaterialDynamicColors.tertiaryContainer,
+  ['tertiary-fixed']: MaterialDynamicColors.tertiaryFixed,
+  ['tertiary-fixed-dim']: MaterialDynamicColors.tertiaryFixedDim,
 };
 
 /**