diff --git a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-custom-dialog.component.ts b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-custom-dialog.component.ts
index 02d4c96ed89..433a51c3554 100644
--- a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-custom-dialog.component.ts
+++ b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-custom-dialog.component.ts
@@ -246,8 +246,9 @@ export class IgxExcelStyleCustomDialogComponent implements AfterViewInit {
 
     private createInitialExpressionUIElement() {
         if (this.expressionsList.length == 1) {
-            const currentExpr = this.expressionsList[0].expression;
-            if (currentExpr.condition.name === this.selectedOperator) {
+            const currentExprUI = this.expressionsList.pop();
+            if (currentExprUI.expression.condition.name === this.selectedOperator) {
+                currentExprUI.beforeOperator = FilteringLogic.And;
                 const secondExprUI = new ExpressionUI();
                 secondExprUI.expression = {
                     condition: null,
@@ -255,9 +256,8 @@ export class IgxExcelStyleCustomDialogComponent implements AfterViewInit {
                     ignoreCase: this.column.filteringIgnoreCase,
                     searchVal: null
                 };
-
-                secondExprUI.beforeOperator = FilteringLogic.And;
-
+                currentExprUI.afterOperator = FilteringLogic.And;
+                this.expressionsList.push(currentExprUI);
                 this.expressionsList.push(secondExprUI);
                 return;
             }
diff --git a/projects/igniteui-angular/src/lib/grids/headers/grid-header.component.ts b/projects/igniteui-angular/src/lib/grids/headers/grid-header.component.ts
index ff213911677..b320df9e175 100644
--- a/projects/igniteui-angular/src/lib/grids/headers/grid-header.component.ts
+++ b/projects/igniteui-angular/src/lib/grids/headers/grid-header.component.ts
@@ -154,7 +154,7 @@ export class IgxGridHeaderComponent implements DoCheck, OnDestroy {
     }
 
     public get filterIconClassName() {
-        return this.column.filteringExpressionsTree ? 'igx-excel-filter__icon--filtered' : 'igx-excel-filter__icon';
+        return this.column.filteringExpressionsTree || this.isAdvancedFilterApplied() ? 'igx-excel-filter__icon--filtered' : 'igx-excel-filter__icon';
     }
 
     public get selectable() {
@@ -276,6 +276,13 @@ export class IgxGridHeaderComponent implements DoCheck, OnDestroy {
         this.sortDirection = expr ? expr.dir : SortingDirection.None;
     }
 
+    protected isAdvancedFilterApplied() {
+        if(!this.grid.advancedFilteringExpressionsTree) {
+            return false;
+        }
+        return !!this.grid.advancedFilteringExpressionsTree.find(this.column.field);
+    }
+
     private triggerSort() {
         const groupingExpr = this.grid.groupingExpressions ?
             this.grid.groupingExpressions.find((expr) => expr.fieldName === this.column.field) :
diff --git a/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar-advanced-filtering.component.html b/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar-advanced-filtering.component.html
index 8a92942a118..ed9fd801f98 100644
--- a/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar-advanced-filtering.component.html
+++ b/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar-advanced-filtering.component.html
@@ -7,4 +7,5 @@
         <ng-content></ng-content>
     </span>
     <span *ngIf="!ref.childNodes.length">{{ grid?.resourceStrings.igx_grid_toolbar_advanced_filtering_button_label }}</span>
+    <span *ngIf="grid?.advancedFilteringExpressionsTree"> ({{ grid?.advancedFilteringExpressionsTree.filteringOperands.length}}) </span>
 </button>