diff --git a/src/utils/static-data.js b/src/utils/static-data.js
index 894661af..cee15a00 100644
--- a/src/utils/static-data.js
+++ b/src/utils/static-data.js
@@ -222,26 +222,31 @@ export const dataForNpmEventsHeader = {
   chartData: [
     {
       eventSeverity: 'overall.critical',
+      class: 'critical',
       count: '-',
       index: 0
     },
     {
       eventSeverity: 'overall.high',
+      class: 'high',
       count: '-',
       index: 1
     },
     {
       eventSeverity: 'overall.medium',
+      class: 'medium',
       count: '-',
       index: 2
     },
     {
       eventSeverity: 'overall.low',
+      class: 'low',
       count: '-',
       index: 3
     },
     {
       eventSeverity: 'overall.info',
+      class: 'info',
       count: '-',
       index: 4
     }
diff --git a/src/views/charts2/charts/npm/NpmEventsHeader.vue b/src/views/charts2/charts/npm/NpmEventsHeader.vue
index 329679a7..9e2872f0 100644
--- a/src/views/charts2/charts/npm/NpmEventsHeader.vue
+++ b/src/views/charts2/charts/npm/NpmEventsHeader.vue
@@ -2,7 +2,7 @@
  <div class="npm-header">
   <div class="npm-header-body" v-for="(item, index) in chartData" :key=index>
     <div class="npm-header-body-severity">
-      <div class="npm-header-body-severity-icon" :class="item.eventSeverity" :test-id="`icon${index}`"></div>
+      <div class="npm-header-body-severity-icon" :class="item.class" :test-id="`icon${index}`"></div>
       <div class="npm-header-body-severity-value" :test-id="`severity${index}`">{{ $t(item.eventSeverity) }}</div>
     </div>
     <chart-error v-if="showError" tooltip :content="errorMsg" />