diff --git a/packages/types/src/charts.d.ts b/packages/types/src/charts.d.ts
index b4acdbd620..64eaff0434 100644
--- a/packages/types/src/charts.d.ts
+++ b/packages/types/src/charts.d.ts
@@ -35,6 +35,7 @@ export type TStackedBarChartProps<K extends string, T extends string> = {
 export type TreeMapItem = {
   name: string;
   value: number;
+  label?: string;
   textClassName?: string;
   icon?: React.ReactElement;
 } & (
diff --git a/web/core/components/core/charts/tree-map/map-content.tsx b/web/core/components/core/charts/tree-map/map-content.tsx
index e99988a70a..dc178f9baa 100644
--- a/web/core/components/core/charts/tree-map/map-content.tsx
+++ b/web/core/components/core/charts/tree-map/map-content.tsx
@@ -31,6 +31,7 @@ export const CustomTreeMapContent = ({
   height,
   name,
   value,
+  label,
   fillColor,
   fillClassName,
   textClassName,
@@ -109,10 +110,11 @@ export const CustomTreeMapContent = ({
         x={pX + TEXT_PADDING_LEFT}
         y={pY + pHeight - TEXT_PADDING_LEFT}
         textAnchor="start"
-        className={cn("text-xs", textClassName || "text-custom-text-300")}
+        className={cn("text-xs font-light tracking-wider", textClassName || "text-custom-text-300")}
         fill="currentColor"
       >
         {value?.toLocaleString()}
+        {label && ` ${label}`}
       </text>
     </g>
   );