diff --git a/static/app/views/preprod/components/visualizations/appSizeTheme.ts b/static/app/views/preprod/components/visualizations/appSizeTheme.ts
index 4d8c3a0e720d7e..af477319a1b2ef 100644
--- a/static/app/views/preprod/components/visualizations/appSizeTheme.ts
+++ b/static/app/views/preprod/components/visualizations/appSizeTheme.ts
@@ -11,7 +11,7 @@ export function getAppSizeCategoryInfo(
     return color(baseColor).alpha(0.6).string();
   };
 
-  const colorPalette = theme.chart.getColorPalette(6);
+  const colorPalette = theme.chart.getColorPalette(7);
 
   const neutralColor = 'hsla(270, 20%, 50%, 0.5)';
   const groupColor1 = colorPalette[0];
@@ -20,6 +20,7 @@ export function getAppSizeCategoryInfo(
   const groupColor4 = colorPalette[3];
   const groupColor5 = colorPalette[4];
   const groupColor6 = colorPalette[5];
+  const groupColor7 = colorPalette[6];
 
   return {
     [TreemapType.FILES]: {
@@ -157,5 +158,10 @@ export function getAppSizeCategoryInfo(
       headerColor: createHeaderColor(groupColor1),
       displayName: t('Code Signature'),
     },
+    [TreemapType.AUDIO]: {
+      color: groupColor7,
+      headerColor: createHeaderColor(groupColor7),
+      displayName: t('Audio'),
+    },
   };
 }
diff --git a/static/app/views/preprod/types/appSizeTypes.ts b/static/app/views/preprod/types/appSizeTypes.ts
index 5fcf91c1f4d71b..0edd241cfc90b4 100644
--- a/static/app/views/preprod/types/appSizeTypes.ts
+++ b/static/app/views/preprod/types/appSizeTypes.ts
@@ -66,6 +66,7 @@ export enum TreemapType {
   MANIFESTS = 'manifests',
   SIGNATURES = 'signatures',
   FONTS = 'fonts',
+  AUDIO = 'audio',
 
   // iOS-specific categories
   FRAMEWORKS = 'frameworks',