diff --git a/index.html b/index.html
index 9f03cd32f..7c08bc24b 100644
--- a/index.html
+++ b/index.html
@@ -22,7 +22,7 @@
           </div>
         </div>
 
-      <nav class="top-bar" data-topbar ng-show="$root.peerId">
+      <nav class="top-bar" data-topbar ><!-- ng-show="$root.peerId" -->
         <ul class="title-area">
           <li class="name"></li>
           <li class="toggle-topbar menu-icon">
@@ -32,8 +32,8 @@
 
         <section class="top-bar-section">
           <ul>
-            <li style="width:20%;" data-ng-repeat="item in menu" ui-route="/{{item.link}}" class="text-center" data-ng-class="{active: isActive(item)}">
-              <a href="{{item.link}}"> <i class="fi-home size-16"></i> {{item.title}}</a>
+            <li data-ng-repeat="item in menu" ui-route="/{{item.link}}" class="large-2 text-center" data-ng-class="{active: isActive(item)}">
+              <a href="{{item.link}}"> <i class="{{item.icon}}"></i> {{item.title}}</a>
             </li>
           </ul>
         </section>
diff --git a/js/controllers/header.js b/js/controllers/header.js
index 161181d6a..c84b16269 100644
--- a/js/controllers/header.js
+++ b/js/controllers/header.js
@@ -4,20 +4,29 @@ angular.module('copay.header').controller('HeaderController',
   function($scope, $rootScope, $location, Network) {
     $scope.menu = [{
       'title': 'Home',
+      'icon': 'fi-home',
       'link': '#/home'
     }, {
       'title': 'Copayers',
+      'icon': 'fi-torsos-all',
       'link': '#/peer'
     }, {
       'title': 'Transactions',
+      'icon': 'fi-loop',
       'link': '#/transactions'
     }, {
       'title': 'Send',
+      'icon': 'fi-arrow-right',
       'link': '#/send'
     }, {
       'title': 'Backup',
+      'icon': 'fi-archive',
       'link': '#/backup'
-    }];
+    }, {
+      'title': 'signout',
+      'icon': 'fi-power',
+      'link': '#/signout'
+    }]
 
     if (!$rootScope.peerId) {
       $location.path('signin');