diff --git a/src/app/components/calendar/calendar.ts b/src/app/components/calendar/calendar.ts
index c29587d417e..59457debf98 100755
--- a/src/app/components/calendar/calendar.ts
+++ b/src/app/components/calendar/calendar.ts
@@ -120,7 +120,9 @@ export const CALENDAR_VALUE_ACCESSOR: any = {
                     </ng-container>
                 </button>
                 <ng-container *ngIf="iconDisplay === 'input' && showIcon">
-                    <CalendarIcon *ngIf="!inputIconTemplate" (click)="onButtonClick($event)" class="p-datepicker-icon" />
+                    <CalendarIcon (click)="onButtonClick($event)" *ngIf="!inputIconTemplate" [ngClass]="{
+                        'p-datepicker-icon': showOnFocus
+                    }"/>
                     <ng-container *ngTemplateOutlet="inputIconTemplate; context: { clickCallBack: onButtonClick.bind(this) }"></ng-container>
                 </ng-container>
             </ng-template>