diff --git a/src/ui_ng/lib/src/helm-chart/helm-chart.component.html b/src/ui_ng/lib/src/helm-chart/helm-chart.component.html
index 7dac78e10..a1aa64780 100644
--- a/src/ui_ng/lib/src/helm-chart/helm-chart.component.html
+++ b/src/ui_ng/lib/src/helm-chart/helm-chart.component.html
@@ -34,6 +34,9 @@
                 <clr-dg-placeholder>{{'HELM_CHART.PLACEHOLDER' | translate }}</clr-dg-placeholder>
                 <clr-dg-row *ngFor="let chart of charts" [clrDgItem]="chart">
                     <clr-dg-cell>
+                        <span class="list-img">
+                           <img  class="size-24 margin-right-12" [src]="chart.icon ?chart.icon:chartDefaultIcon"  (error)="getDefaultIcon(chart);" />
+                        </span>
                         <a href="javascript:void(0)" (click)="onChartClick(chart)">{{ chart.name }}</a>
                     </clr-dg-cell>
                     <clr-dg-cell>{{ chart.total_versions }}</clr-dg-cell>
diff --git a/src/ui_ng/lib/src/helm-chart/helm-chart.component.scss b/src/ui_ng/lib/src/helm-chart/helm-chart.component.scss
index 042fc04bc..b28effd7f 100644
--- a/src/ui_ng/lib/src/helm-chart/helm-chart.component.scss
+++ b/src/ui_ng/lib/src/helm-chart/helm-chart.component.scss
@@ -1,12 +1,12 @@
+@import "../mixin";
+$width:24px;
+$height:$width;
 .chart-tool {
     position: relative;
     .toolbar {
         overflow: hidden;
         .rightPos {
-            position: absolute;
-            z-index: 100;
-            right: 35px;
-            margin-top: 4px;
+            @include grid-left-top-pos;
             .filter-divider {
                 display: inline-block;
                 height: 16px;
@@ -59,4 +59,13 @@
     display: inline-block;
     height: 100%;
     vertical-align: middle;
+}
+
+.size-24 {
+    width:$width;
+    height:$height;
+}
+
+.margin-right-12 {
+    margin-right:12px;
 }
\ No newline at end of file
diff --git a/src/ui_ng/lib/src/helm-chart/helm-chart.component.ts b/src/ui_ng/lib/src/helm-chart/helm-chart.component.ts
index b367d52e8..0f943559b 100644
--- a/src/ui_ng/lib/src/helm-chart/helm-chart.component.ts
+++ b/src/ui_ng/lib/src/helm-chart/helm-chart.component.ts
@@ -14,6 +14,7 @@ import { SystemInfo, SystemInfoService, HelmChartItem } from "../service/index";
 import { ErrorHandler } from "../error-handler/error-handler";
 import { toPromise, DEFAULT_PAGE_SIZE } from "../utils";
 import { HelmChartService } from "../service/helm-chart.service";
+import { DefaultHelmIcon} from "../shared/shared.const";
 
 @Component({
   selector: "hbr-helm-chart",
@@ -30,6 +31,7 @@ export class HelmChartComponent implements OnInit {
   @Input() hasProjectAdminRole: boolean;
   @Output() chartClickEvt = new EventEmitter<any>();
   @Output() chartDownloadEve = new EventEmitter<string>();
+  @Input() chartDefaultIcon: string = DefaultHelmIcon;
 
   lastFilteredChartName: string;
   charts: HelmChartItem[] = [];
@@ -173,4 +175,8 @@ export class HelmChartComponent implements OnInit {
       return this.listHover;
     }
   }
+
+  getDefaultIcon(chart: HelmChartItem) {
+    chart.icon = this.chartDefaultIcon;
+  }
 }