diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/cards/api-usage-widget.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/cards/api-usage-widget.component.ts
index b41f5ed02a..af315b226a 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/cards/api-usage-widget.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/cards/api-usage-widget.component.ts
@@ -30,6 +30,7 @@ import {
   ApiUsageWidgetSettings,
   getUniqueDataKeys
 } from '@home/components/widget/lib/settings/cards/api-usage-settings.component.models';
+import { ShortNumberPipe } from '@shared/pipe/short-number.pipe';
 
 @Component({
     selector: 'tb-api-usage-widget',
@@ -57,18 +58,12 @@ export class ApiUsageWidgetComponent implements OnInit, OnDestroy {
   noDataDisplayMessageText: string;
 
   private contentResize$: ResizeObserver;
-  private powers: {key: string, value: number}[] = [
-    { key: 'Q', value: 1e15 },
-    { key: 'T', value: 1e12 },
-    { key: 'B', value: 1e9 },
-    { key: 'M', value: 1e6 },
-    { key: 'K', value: 1e3 }
-  ];
 
   constructor(private imagePipe: ImagePipe,
               private utils: UtilsService,
               private sanitizer: DomSanitizer,
-              private cd: ChangeDetectorRef) {
+              private cd: ChangeDetectorRef,
+              private shortNumberPipe: ShortNumberPipe) {
   }
 
   ngOnInit(): void {
@@ -95,8 +90,8 @@ export class ApiUsageWidgetComponent implements OnInit, OnDestroy {
             const progress = (this.isFiniteNumber(data[0][key.maxLimit.key]) && data[0][key.maxLimit.key] !== 0) ? Math.min(100, ((data[0][key.current.key] / data[0][key.maxLimit.key]) * 100)) : 0;
             key.progress = isFinite(progress) ? progress : 0;
             key.status.value = data[0][key.status.key] ? data[0][key.status.key].toLowerCase() : 'enabled';
-            key.maxLimit.value = this.isFiniteNumber(data[0][key.maxLimit.key]) && data[0][key.maxLimit.key] !== 0 ? this.toShortNumber(data[0][key.maxLimit.key]) : '∞';
-            key.current.value = this.isFiniteNumber(data[0][key.current.key]) ? this.toShortNumber(data[0][key.current.key]) : 0;
+            key.maxLimit.value = this.isFiniteNumber(data[0][key.maxLimit.key]) && data[0][key.maxLimit.key] !== 0 ?  this.shortNumberPipe.transform(data[0][key.maxLimit.key]) : '∞';
+            key.current.value = this.isFiniteNumber(data[0][key.current.key]) ? this.shortNumberPipe.transform(data[0][key.current.key], {roundDown: true}) : 0;
           });
           this.cd.detectChanges();
         }
@@ -145,20 +140,6 @@ export class ApiUsageWidgetComponent implements OnInit, OnDestroy {
     }
   }
 
-  private toShortNumber(number: any, decimals = 1) {
-    if (!Number.isFinite(number) || number < 0) {
-      return '0';
-    }
-    for (const power of this.powers) {
-      if (number >= power.value) {
-        const reduced = number / power.value;
-        const rounded = Number(reduced.toFixed(decimals));
-        return `${rounded}${power.key}`;
-      }
-    }
-    return `${Number(number.toFixed(decimals))}`;
-  }
-
   public onInit() {
     const borderRadius = this.ctx.$widgetElement.css('borderRadius');
     this.overlayStyle = {...this.overlayStyle, ...{borderRadius}};
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/home-page/usage-info-widget.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/home-page/usage-info-widget.component.html
index d23b7b8e50..92ef58c640 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/home-page/usage-info-widget.component.html
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/home-page/usage-info-widget.component.html
@@ -63,11 +63,11 @@
           </div>
           <div class="tb-usage-items-values">
             <div class="tb-usage-items-counts">
-              <div class="tb-usage-item-counts" [class.critical]="apiCallItemCritical.transportMessages">{{ usageInfo?.transportMessages | shortNumber }} / {{ maxValue(usageInfo?.maxTransportMessages) }}</div>
-              <div class="tb-usage-item-counts" [class.critical]="apiCallItemCritical.jsExecutions">{{ usageInfo?.jsExecutions | shortNumber }} / {{ maxValue(usageInfo?.maxJsExecutions) }}</div>
-              <div class="tb-usage-item-counts" [class.critical]="apiCallItemCritical.alarms">{{ usageInfo?.alarms | shortNumber }} / {{ maxValue(usageInfo?.maxAlarms) }}</div>
-              <div class="tb-usage-item-counts" [class.critical]="apiCallItemCritical.emails">{{ usageInfo?.emails | shortNumber }} / {{ maxValue(usageInfo?.maxEmails) }}</div>
-              <div class="tb-usage-item-counts" [class.critical]="apiCallItemCritical.sms">{{ usageInfo?.sms | shortNumber }} / {{ maxValue(usageInfo?.maxSms) }}</div>
+              <div class="tb-usage-item-counts" [class.critical]="apiCallItemCritical.transportMessages">{{ usageInfo?.transportMessages | shortNumber: {roundDown: true} }} / {{ maxValue(usageInfo?.maxTransportMessages) }}</div>
+              <div class="tb-usage-item-counts" [class.critical]="apiCallItemCritical.jsExecutions">{{ usageInfo?.jsExecutions | shortNumber: {roundDown: true} }} / {{ maxValue(usageInfo?.maxJsExecutions) }}</div>
+              <div class="tb-usage-item-counts" [class.critical]="apiCallItemCritical.alarms">{{ usageInfo?.alarms | shortNumber: {roundDown: true} }} / {{ maxValue(usageInfo?.maxAlarms) }}</div>
+              <div class="tb-usage-item-counts" [class.critical]="apiCallItemCritical.emails">{{ usageInfo?.emails | shortNumber: {roundDown: true} }} / {{ maxValue(usageInfo?.maxEmails) }}</div>
+              <div class="tb-usage-item-counts" [class.critical]="apiCallItemCritical.sms">{{ usageInfo?.sms | shortNumber: {roundDown: true} }} / {{ maxValue(usageInfo?.maxSms) }}</div>
             </div>
             <div class="tb-usage-items-progress">
               <mat-progress-bar [class.critical]="apiCallItemCritical.transportMessages" color="primary" mode="determinate" [value]="progressValue(usageInfo?.transportMessages, usageInfo?.maxTransportMessages)"></mat-progress-bar>