diff --git a/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/all-pd/all-pd.component.html b/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/all-pd/all-pd.component.html
index 26a1a14eb..c90384612 100644
--- a/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/all-pd/all-pd.component.html
+++ b/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/all-pd/all-pd.component.html
@@ -31,7 +31,7 @@
              </ng-container>
               <ng-container matColumnDef="Action">
                    <mat-cell class="cell center" *matCellDef="let details;">
-                      <button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" (click)="viewPD(details.pd_id)" matTooltip="View" 
+                      <button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" color="primary" (click)="viewPD(details.pd_id)" matTooltip="View" 
                       matTooltipPosition="above"><mat-icon>visibility</mat-icon></button>
                   </mat-cell>
               </ng-container>
diff --git a/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/completed-pd/completed-pd.component.html b/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/completed-pd/completed-pd.component.html
index 4fe4b3d2f..6b1dabefe 100644
--- a/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/completed-pd/completed-pd.component.html
+++ b/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/completed-pd/completed-pd.component.html
@@ -30,7 +30,7 @@
               <ng-container matColumnDef="Action">
                    <mat-cell class="cell center" *matCellDef="let details;">
                       <button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" (click)="viewPD(details.pd_id)" matTooltip="View" 
-                      matTooltipPosition="above" ><mat-icon>visibility</mat-icon></button>
+                      matTooltipPosition="above" color="primary"><mat-icon>visibility</mat-icon></button>
                   </mat-cell>
               </ng-container>
               <mat-row style="align-items: normal !important;" *matRowDef="let row; columns: displayedColumns;">
diff --git a/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/inprogress-pd/inprogress-pd.component.html b/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/inprogress-pd/inprogress-pd.component.html
index 2d8717a78..4487795cc 100644
--- a/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/inprogress-pd/inprogress-pd.component.html
+++ b/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/inprogress-pd/inprogress-pd.component.html
@@ -29,7 +29,7 @@
              </ng-container>
               <ng-container matColumnDef="Action">
                    <mat-cell class="cell center" *matCellDef="let details;">
-                      <button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" (click)="viewPD(details.pd_id)" matTooltip="View" matTooltipPosition="above"><mat-icon>visibility</mat-icon></button>
+                      <button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" (click)="viewPD(details.pd_id)" matTooltip="View" matTooltipPosition="above" color="primary"><mat-icon>visibility</mat-icon></button>
                   </mat-cell>
               </ng-container>
               <mat-row style="align-items: normal !important;" *matRowDef="let row; columns: displayedColumns;">
diff --git a/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/list-pd.component.html b/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/list-pd.component.html
index 5b846cb0d..405e0fb14 100644
--- a/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/list-pd.component.html
+++ b/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/list-pd.component.html
@@ -15,26 +15,26 @@
     <mat-card>
       <mat-tab-group (selectedTabChange)="onTabClick($event)">
         <mat-tab >
-          <ng-template mat-tab-label>All</ng-template>
+          <ng-template mat-tab-label><mat-icon>select_all</mat-icon>&nbsp;All</ng-template>
          <app-all-pd [bindFilterValue]="filterValue" (loadPdView)="viewPDDetails($event)"></app-all-pd>
         </mat-tab>
         <mat-tab>
-            <ng-template mat-tab-label>Scheduled </ng-template>
+            <ng-template mat-tab-label><mat-icon>schedule</mat-icon>&nbsp;Scheduled </ng-template>
             <app-scheduled-pd [bindFilterValue]="filterValue" (loadPdView)="viewPDDetails($event)"></app-scheduled-pd>
   
           </mat-tab>
         <mat-tab>
-          <ng-template mat-tab-label>In Progress </ng-template>
+          <ng-template mat-tab-label><mat-icon>hdr_strong</mat-icon> &nbsp;In Progress </ng-template>
           <app-inprogress-pd [bindFilterValue]="filterValue" (loadPdView)="viewPDDetails($event)"></app-inprogress-pd>
         </mat-tab>
       <mat-tab>
-          <ng-template mat-tab-label>Completed </ng-template>
+          <ng-template mat-tab-label><mat-icon>done</mat-icon> &nbsp;Completed </ng-template>
           <app-completed-pd [bindFilterValue]="filterValue" (loadPdView)="viewPDDetails($event)"></app-completed-pd>
 
          
         </mat-tab>
         <mat-tab>
-          <ng-template mat-tab-label>QC Completed </ng-template>
+          <ng-template mat-tab-label><mat-icon>done_all</mat-icon>&nbsp;QC_Completed </ng-template>
           <app-qc-completed-pd [bindFilterValue]="filterValue" (loadPdView)="viewPDDetails($event)"></app-qc-completed-pd>
   
          
diff --git a/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/list-pd.component.scss b/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/list-pd.component.scss
index 9e293a473..123db6e6c 100644
--- a/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/list-pd.component.scss
+++ b/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/list-pd.component.scss
@@ -13,4 +13,11 @@
 }
 .fontsize{
     font-size:14px;
-}
\ No newline at end of file
+}
+
+.mat-ink-bar{
+    background-color:red;
+}
+.mat-tab-label-active{
+     color: red !important;
+ } 
\ No newline at end of file
diff --git a/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/qc-completed-pd/qc-completed-pd.component.html b/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/qc-completed-pd/qc-completed-pd.component.html
index 8b1d38166..785c6309b 100644
--- a/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/qc-completed-pd/qc-completed-pd.component.html
+++ b/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/qc-completed-pd/qc-completed-pd.component.html
@@ -29,7 +29,7 @@
        </ng-container>
         <ng-container matColumnDef="Action">
              <mat-cell class="cell center" *matCellDef="let details;">
-                <button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" (click)="viewPD(details.pd_id)" matTooltip="View" matTooltipPosition="above"><mat-icon>visibility</mat-icon></button>
+                <button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" (click)="viewPD(details.pd_id)" matTooltip="View" matTooltipPosition="above" color="primary"><mat-icon>visibility</mat-icon></button>
             </mat-cell>
         </ng-container>
         <mat-row style="align-items: normal !important;" *matRowDef="let row; columns: displayedColumns;">
diff --git a/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/scheduled-pd/scheduled-pd.component.html b/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/scheduled-pd/scheduled-pd.component.html
index 7c7ba2623..f8177653a 100644
--- a/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/scheduled-pd/scheduled-pd.component.html
+++ b/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/scheduled-pd/scheduled-pd.component.html
@@ -32,7 +32,7 @@
              </ng-container>
               <ng-container matColumnDef="Action">
                    <mat-cell class="cell center" *matCellDef="let details;">
-                      <button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" (click)="viewPD(details.pd_id)"><mat-icon>visibility</mat-icon></button>
+                      <button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" (click)="viewPD(details.pd_id)" color="primary"><mat-icon>visibility</mat-icon></button>
                   </mat-cell>
               </ng-container>
               <mat-row style="align-items: normal !important;" *matRowDef="let row; columns: displayedColumns;">
diff --git a/ng6-seed/src/app/quality-check/qc-list/qc-list.component.html b/ng6-seed/src/app/quality-check/qc-list/qc-list.component.html
index 5dd4f9d75..bbe37f0d7 100644
--- a/ng6-seed/src/app/quality-check/qc-list/qc-list.component.html
+++ b/ng6-seed/src/app/quality-check/qc-list/qc-list.component.html
@@ -11,11 +11,11 @@
   <mat-card>
     <mat-tab-group (selectedTabChange)="onTabClick($event)">
     <mat-tab>
-        <ng-template mat-tab-label>Completed </ng-template>
+        <ng-template mat-tab-label><mat-icon>done</mat-icon>&nbsp;Completed </ng-template>
         <app-completed-pd [bindFilterValue]="filterValue" (loadPdView)="viewPDDetails($event)"></app-completed-pd>
       </mat-tab>
       <mat-tab>
-        <ng-template mat-tab-label>QC Completed </ng-template>
+        <ng-template mat-tab-label><mat-icon>done_all</mat-icon>&nbsp;QC Completed </ng-template>
         <app-qc-completed-pd [bindFilterValue]="filterValue" (loadPdView)="viewPDDetails($event)"></app-qc-completed-pd>
 
        
diff --git a/ng6-seed/src/app/quality-check/qc-list/qc-list.component.scss b/ng6-seed/src/app/quality-check/qc-list/qc-list.component.scss
index 9e293a473..123db6e6c 100644
--- a/ng6-seed/src/app/quality-check/qc-list/qc-list.component.scss
+++ b/ng6-seed/src/app/quality-check/qc-list/qc-list.component.scss
@@ -13,4 +13,11 @@
 }
 .fontsize{
     font-size:14px;
-}
\ No newline at end of file
+}
+
+.mat-ink-bar{
+    background-color:red;
+}
+.mat-tab-label-active{
+     color: red !important;
+ } 
\ No newline at end of file