diff --git a/src/app/pages/e-commerce/traffic-reveal-card/front-side/traffic-front-card.component.html b/src/app/pages/e-commerce/traffic-reveal-card/front-side/traffic-front-card.component.html
index a762b16e..831d1ad1 100644
--- a/src/app/pages/e-commerce/traffic-reveal-card/front-side/traffic-front-card.component.html
+++ b/src/app/pages/e-commerce/traffic-reveal-card/front-side/traffic-front-card.component.html
@@ -3,6 +3,7 @@
     <span class="caption">{{ item.date }}</span>
     <span>{{ item.value }}</span>
     <span class="delta" [class.up]="item.delta.up" [class.down]="!item.delta.up">
+      <nb-icon [icon]="item.delta.up ? 'arrow-up' : 'arrow-down'" pack="eva"></nb-icon>
       {{ item.delta.value }}%
     </span>
     <ngx-traffic-bar [barData]="item.comparison" [successDelta]="item.delta.up">
diff --git a/src/app/pages/e-commerce/traffic-reveal-card/front-side/traffic-front-card.component.scss b/src/app/pages/e-commerce/traffic-reveal-card/front-side/traffic-front-card.component.scss
index 4c100b81..96a76ff4 100644
--- a/src/app/pages/e-commerce/traffic-reveal-card/front-side/traffic-front-card.component.scss
+++ b/src/app/pages/e-commerce/traffic-reveal-card/front-side/traffic-front-card.component.scss
@@ -30,31 +30,16 @@
     display: flex;
     align-items: center;
 
-    &::before {
-      content: '';
-      right: 100%;
-      @include nb-ltr(margin-right, 0.7rem);
-      @include nb-rtl(margin-left, 0.7rem);
-      border-left: 5px solid transparent;
-      border-right: 5px solid transparent;
-    }
-
     &.down {
       color: nb-theme(color-danger-default);
-
-      &::before {
-        bottom: 5px;
-        border-top: 6px solid nb-theme(color-danger-default);
-      }
     }
 
     &.up {
       color: nb-theme(color-success-default);
+    }
 
-      &::before {
-        top: 5px;
-        border-bottom: 6px solid nb-theme(color-success-default);
-      }
+    nb-icon ::ng-deep svg {
+      vertical-align: top;
     }
   }
 
diff --git a/src/app/pages/e-commerce/user-activity/user-activity.component.html b/src/app/pages/e-commerce/user-activity/user-activity.component.html
index 30a756c6..445f18f9 100644
--- a/src/app/pages/e-commerce/user-activity/user-activity.component.html
+++ b/src/app/pages/e-commerce/user-activity/user-activity.component.html
@@ -22,6 +22,7 @@
       <div class="visited-percentages">
         <div class="caption">New visits, %</div>
         <div class="delta value" [class.up]="item.deltaUp" [class.down]="!item.deltaUp">
+          <nb-icon [icon]="item.deltaUp ? 'arrow-up' : 'arrow-down'" pack="eva"></nb-icon>
           {{ item.newVisits }}%
         </div>
       </div>
diff --git a/src/app/pages/e-commerce/user-activity/user-activity.component.scss b/src/app/pages/e-commerce/user-activity/user-activity.component.scss
index fed0b00d..ba489d69 100644
--- a/src/app/pages/e-commerce/user-activity/user-activity.component.scss
+++ b/src/app/pages/e-commerce/user-activity/user-activity.component.scss
@@ -38,29 +38,16 @@
     align-items: center;
     position: relative;
 
-    &::before {
-      content: '';
-      right: 100%;
-      @include nb-ltr(margin-right, 0.7rem);
-      @include nb-rtl(margin-left, 0.7rem);
-      border-left: 6px solid transparent;
-      border-right: 6px solid transparent;
-    }
-
     &.down {
       color: nb-theme(color-danger-default);
-
-      &::before {
-        border-top: 6px solid nb-theme(color-danger-default);
-      }
     }
 
     &.up {
       color: nb-theme(color-success-default);
+    }
 
-      &::before {
-        border-bottom: 6px solid nb-theme(color-success-default);
-      }
+    nb-icon ::ng-deep svg {
+      vertical-align: top;
     }
   }
 }