diff --git a/src/app/components/app-header/app-header.component.html b/src/app/components/app-header/app-header.component.html
index 0a50511b3..39e50bf08 100644
--- a/src/app/components/app-header/app-header.component.html
+++ b/src/app/components/app-header/app-header.component.html
@@ -21,9 +21,9 @@
       </a>
     </div>
     <div class="header-right">
-      <div class="header-item">
+      <div class="header-item" *ngIf="user">
         <span class="header-user-span user-item" (click)="menuDropped = !menuDropped">
-          <img src="https://avatars1.githubusercontent.com/u/1796022?s=460&v=4" alt="Jan Kuri" class="avatar-img">
+          <img [src]="user.avatar" class="avatar-img">
           <i class="ionicon ion-chevron-down"></i>
         </span>
         <div class="header-dropdown-menu" *ngIf="menuDropped">
@@ -43,6 +43,10 @@
           </a>
         </div>
       </div>
+      <div class="header-item" *ngIf="!user" routerLink="/login">
+        <img src="/images/icons/login.svg" class="nav-item-icon">
+        Login
+      </div>
     </div>
   </div>
 </header>
diff --git a/src/app/styles/nav.sass b/src/app/styles/nav.sass
index 62c3f13bf..ef4566268 100644
--- a/src/app/styles/nav.sass
+++ b/src/app/styles/nav.sass
@@ -30,6 +30,15 @@
 
       .header-item
         margin-left: 30px
+        font-weight: 700
+        font-size: 13px
+        font-family: $font-family-semibold
+        color: $white
+
+        .nav-item-icon
+          width: 20px
+          height: 20px
+          margin-right: 10px
 
     .header-item
       display: inline-flex