diff --git a/web/gui/src/main/webapp/app/fw/widget/button.js b/web/gui/src/main/webapp/app/fw/widget/button.js
index 721f604..09cdd43 100644
--- a/web/gui/src/main/webapp/app/fw/widget/button.js
+++ b/web/gui/src/main/webapp/app/fw/widget/button.js
@@ -21,7 +21,7 @@
     'use strict';
 
     // injected refs
-    var $log, $rootScope, fs, is, tts;
+    var $log, fs, is, tts;
 
     // configuration
     var btnSize = 25,
@@ -49,15 +49,6 @@
         return btnSize + 2 * btnPadding;
     }
 
-    function addTooltip(elem, tooltip) {
-        elem.on('mouseover', function () { tts.showTooltip(this, tooltip); });
-        elem.on('mouseout', function () { tts.cancelTooltip(this); });
-        $rootScope.$on('$routeChangeStart', function () {
-            tts.cancelTooltip(elem.node());
-        });
-    }
-
-
     // === BUTTON =================================================
 
     // div is where to put the button (d3.selection of a DIV element)
@@ -72,7 +63,7 @@
             cbFnc = fs.isF(cb) || noop;
 
         is.loadIcon(btnDiv, gid, btnSize, true);
-        if (tooltip) { addTooltip(btnDiv, tooltip); }
+        if (tooltip) { tts.addTooltip(btnDiv, tooltip); }
 
         btnDiv.on('click', cbFnc);
 
@@ -100,7 +91,7 @@
 
         is.loadIcon(togDiv, gid, btnSize, true);
         togDiv.classed('selected', sel);
-        if (tooltip) { addTooltip(togDiv, tooltip); }
+        if (tooltip) { tts.addTooltip(togDiv, tooltip); }
 
         function _toggle(b, nocb) {
             sel = (b === undefined) ? !sel : !!b;
@@ -190,7 +181,7 @@
             rbdiv.classed('selected', initSel);
             rbdiv.on('click', rbclick);
             is.loadIcon(rbdiv, btn.gid, btnSize, true);
-            if (btn.tooltip) { addTooltip(rbdiv, btn.tooltip); }
+            if (btn.tooltip) { tts.addTooltip(rbdiv, btn.tooltip); }
             angular.extend(btn, {
                 el: rbdiv,
                 id: rid,
@@ -254,11 +245,10 @@
 
     angular.module('onosWidget')
     .factory('ButtonService',
-        ['$log', '$rootScope', 'FnService', 'IconService', 'TooltipService',
+        ['$log', 'FnService', 'IconService', 'TooltipService',
 
-        function (_$log_, _$rootScope_, _fs_, _is_, _tts_) {
+        function (_$log_, _fs_, _is_, _tts_) {
             $log = _$log_;
-            $rootScope = _$rootScope_;
             fs = _fs_;
             is = _is_;
             tts = _tts_;
diff --git a/web/gui/src/main/webapp/app/fw/widget/table.css b/web/gui/src/main/webapp/app/fw/widget/table.css
index e1dc708..ae5ef03 100644
--- a/web/gui/src/main/webapp/app/fw/widget/table.css
+++ b/web/gui/src/main/webapp/app/fw/widget/table.css
@@ -163,10 +163,17 @@
 }
 
 /* Refresh button specific */
+.light .ctrl-btns div.refresh.active g.icon rect {
+    fill: #964949;
+}
+
+.dark .ctrl-btns div.refresh.active g.icon rect {
+    fill: #9B4641;
+}
 .light .ctrl-btns div.refresh:hover g.icon rect {
-    fill: #800;
+    fill: #964949;
 }
 
 .dark .ctrl-btns div.refresh:hover g.icon rect {
-    fill: #CE5650;
+    fill: #9B4641;
 }
diff --git a/web/gui/src/main/webapp/app/fw/widget/tableBuilder.js b/web/gui/src/main/webapp/app/fw/widget/tableBuilder.js
index ba04b30..4f418e7 100644
--- a/web/gui/src/main/webapp/app/fw/widget/tableBuilder.js
+++ b/web/gui/src/main/webapp/app/fw/widget/tableBuilder.js
@@ -50,6 +50,7 @@
         o.scope.tableData = [];
         o.scope.sortParams = {};
         o.scope.autoRefresh = true;
+        o.scope.autoRefreshTip = 'Toggle auto refresh';
 
         function respCb(data) {
             o.scope.tableData = data[root];
diff --git a/web/gui/src/main/webapp/app/fw/widget/tooltip.js b/web/gui/src/main/webapp/app/fw/widget/tooltip.js
index 46b5f80..dd8a695 100644
--- a/web/gui/src/main/webapp/app/fw/widget/tooltip.js
+++ b/web/gui/src/main/webapp/app/fw/widget/tooltip.js
@@ -22,7 +22,7 @@
     'use strict';
 
     // injected references
-    var $log, fs;
+    var $log, $rootScope, fs;
 
     // constants
     var hoverHeight = 35,
@@ -65,6 +65,14 @@
 
     // === API functions ------------------------------------------------
 
+    function addTooltip(elem, tooltip) {
+        elem.on('mouseover', function () { showTooltip(this, tooltip); });
+        elem.on('mouseout', function () { cancelTooltip(this); });
+        $rootScope.$on('$routeChangeStart', function () {
+            cancelTooltip(elem.node());
+        });
+    }
+
     function showTooltip(el, msg) {
         // tooltips don't make sense on mobile devices
         if (!el || !msg || fs.isMobile()) {
@@ -105,17 +113,34 @@
     }
 
     angular.module('onosWidget')
-        .factory('TooltipService', ['$log', 'FnService',
 
-        function (_$log_, _fs_) {
-            $log = _$log_;
-            fs = _fs_;
+        .directive('tooltip', ['$rootScope', 'FnService',
+            function (_$rootScope_, _fs_) {
+                $rootScope = _$rootScope_;
+                fs = _fs_;
 
-            init();
+                init();
 
-            return {
-                showTooltip: showTooltip,
-                cancelTooltip: cancelTooltip
-            };
-        }]);
+                return {
+                    restrict: 'A',
+                    link: function (scope, elem, attrs) {
+                        addTooltip(d3.select(elem[0]), scope[attrs.ttMsg]);
+                    }
+                };
+        }])
+
+        .factory('TooltipService', ['$log', '$rootScope', 'FnService',
+            function (_$log_, _$rootScope_, _fs_) {
+                $log = _$log_;
+                $rootScope = _$rootScope_;
+                fs = _fs_;
+
+                init();
+
+                return {
+                    addTooltip: addTooltip,
+                    showTooltip: showTooltip,
+                    cancelTooltip: cancelTooltip
+                };
+            }]);
 }());
diff --git a/web/gui/src/main/webapp/app/view/app/app.html b/web/gui/src/main/webapp/app/view/app/app.html
index 8bfd202..9df05b8 100644
--- a/web/gui/src/main/webapp/app/view/app/app.html
+++ b/web/gui/src/main/webapp/app/view/app/app.html
@@ -5,6 +5,7 @@
         <div class="ctrl-btns">
             <div class="refresh" ng-class="{active: autoRefresh}"
                  icon icon-size="36" icon-id="refresh"
+                 tooltip tt-msg="autoRefreshTip"
                  ng-click="toggleRefresh()"></div>
             <div class="separator"></div>
 
@@ -14,18 +15,22 @@
                        file-model="appFile">
             </form>
             <div icon icon-size="36" icon-id="plus"
-                 class="active" trigger-form>
+                 class="active" trigger-form
+                 tooltip tt-msg="uploadTip">
             </div>
             <div icon icon-size="36" icon-id="play"
                  ng-click="appAction('activate')"
+                 tooltip tt-msg="activateTip"
                  ng-class="{active: ctrlBtnState.installed}">
             </div>
             <div icon icon-size="36" icon-id="stop"
                  ng-click="appAction('deactivate')"
+                 tooltip tt-msg="deactivateTip"
                  ng-class="{active: ctrlBtnState.active}">
             </div>
             <div icon icon-size="36" icon-id="garbage"
                  ng-click="appAction('uninstall')"
+                 tooltip tt-msg="uninstallTip"
                  ng-class="{active: ctrlBtnState.selection}">
             </div>
         </div>
diff --git a/web/gui/src/main/webapp/app/view/app/app.js b/web/gui/src/main/webapp/app/view/app/app.js
index 55ccd94..c5a7961 100644
--- a/web/gui/src/main/webapp/app/view/app/app.js
+++ b/web/gui/src/main/webapp/app/view/app/app.js
@@ -34,6 +34,10 @@
 
     function ($log, $scope, $http, fs, tbs, wss, ufs) {
         $scope.ctrlBtnState = {};
+        $scope.uploadTip = 'Upload an application';
+        $scope.activateTip = 'Activate selected application';
+        $scope.deactivateTip = 'Deactivate selected application';
+        $scope.uninstallTip = 'Uninstall selected application';
 
         function selCb($event, row) {
             // selId comes from tableBuilder
diff --git a/web/gui/src/main/webapp/app/view/cluster/cluster.html b/web/gui/src/main/webapp/app/view/cluster/cluster.html
index e1db4ee..d51bb43 100644
--- a/web/gui/src/main/webapp/app/view/cluster/cluster.html
+++ b/web/gui/src/main/webapp/app/view/cluster/cluster.html
@@ -21,6 +21,7 @@
         <div class="ctrl-btns">
             <div class="refresh" ng-class="{active: autoRefresh}"
                  icon icon-size="36" icon-id="refresh"
+                 tooltip tt-msg="autoRefreshTip"
                  ng-click="toggleRefresh()"></div>
         </div>
     </div>
diff --git a/web/gui/src/main/webapp/app/view/device/device.html b/web/gui/src/main/webapp/app/view/device/device.html
index 4a63519..b9adfea 100644
--- a/web/gui/src/main/webapp/app/view/device/device.html
+++ b/web/gui/src/main/webapp/app/view/device/device.html
@@ -5,19 +5,23 @@
         <div class="ctrl-btns">
             <div class="refresh" ng-class="{active: autoRefresh}"
                  icon icon-id="refresh" icon-size="36"
+                 tooltip tt-msg="autoRefreshTip"
                  ng-click="toggleRefresh()"></div>
             <div class="separator"></div>
 
             <div ng-class="{active: !!selId}"
                  icon icon-id="flowTable" icon-size="36"
+                 tooltip tt-msg="flowTip"
                  ng-click="nav('flow')"></div>
 
             <div ng-class="{active: !!selId}"
                  icon icon-id="portTable" icon-size="36"
+                 tooltip tt-msg="portTip"
                  ng-click="nav('port')"></div>
 
             <div ng-class="{active: !!selId}"
                  icon icon-id="groupTable" icon-size="36"
+                 tooltip tt-msg="groupTip"
                  ng-click="nav('group')"></div>
         </div>
     </div>
diff --git a/web/gui/src/main/webapp/app/view/device/device.js b/web/gui/src/main/webapp/app/view/device/device.js
index baf1e96..1f8f1cfb 100644
--- a/web/gui/src/main/webapp/app/view/device/device.js
+++ b/web/gui/src/main/webapp/app/view/device/device.js
@@ -203,6 +203,9 @@
             ns = _ns_;
             var handlers = {};
             $scope.panelData = [];
+            $scope.flowTip = 'Show flow view for selected device';
+            $scope.portTip = 'Show port view for selected device';
+            $scope.groupTip = 'Show group view for selected device';
 
             function selCb($event, row) {
                 selRow = angular.element($event.currentTarget);
diff --git a/web/gui/src/main/webapp/app/view/flow/flow.html b/web/gui/src/main/webapp/app/view/flow/flow.html
index da22520..2003698 100644
--- a/web/gui/src/main/webapp/app/view/flow/flow.html
+++ b/web/gui/src/main/webapp/app/view/flow/flow.html
@@ -8,6 +8,7 @@
         <div class="ctrl-btns">
             <div class="refresh" ng-class="{active: autoRefresh}"
                  icon icon-size="36" icon-id="refresh"
+                 tooltip tt-msg="autoRefreshTip"
                  ng-click="toggleRefresh()"></div>
 
             <div class="separator"></div>
@@ -17,10 +18,12 @@
 
             <div class="active"
                  icon icon-id="portTable" icon-size="36"
+                 tooltip tt-msg="portTip"
                  ng-click="nav('port')"></div>
 
             <div class="active"
                  icon icon-id="groupTable" icon-size="36"
+                 tooltip tt-msg="groupTip"
                  ng-click="nav('group')"></div>
         </div>
     </div>
diff --git a/web/gui/src/main/webapp/app/view/flow/flow.js b/web/gui/src/main/webapp/app/view/flow/flow.js
index b9ef0fb..15678d5 100644
--- a/web/gui/src/main/webapp/app/view/flow/flow.js
+++ b/web/gui/src/main/webapp/app/view/flow/flow.js
@@ -37,6 +37,8 @@
             fs = _fs_;
             tbs = _tbs_;
             ns = _ns_;
+            $scope.portTip = 'Show port view for this device';
+            $scope.groupTip = 'Show group view for this device';
 
             params = $location.search();
             if (params.hasOwnProperty('devId')) {
diff --git a/web/gui/src/main/webapp/app/view/group/group.html b/web/gui/src/main/webapp/app/view/group/group.html
index 2b09b94..d5811fb 100644
--- a/web/gui/src/main/webapp/app/view/group/group.html
+++ b/web/gui/src/main/webapp/app/view/group/group.html
@@ -24,16 +24,19 @@
         <div class="ctrl-btns">
             <div class="refresh" ng-class="{active: autoRefresh}"
                  icon icon-size="36" icon-id="refresh"
+                 tooltip tt-msg="autoRefreshTip"
                  ng-click="toggleRefresh()"></div>
 
             <div class="separator"></div>
 
             <div class="active"
                  icon icon-id="flowTable" icon-size="36"
+                 tooltip tt-msg="flowTip"
                  ng-click="nav('flow')"></div>
 
             <div class="active"
                  icon icon-id="portTable" icon-size="36"
+                 tooltip tt-msg="portTip"
                  ng-click="nav('port')"></div>
 
             <div class="current-view"
diff --git a/web/gui/src/main/webapp/app/view/group/group.js b/web/gui/src/main/webapp/app/view/group/group.js
index b8f4d45..2510190 100644
--- a/web/gui/src/main/webapp/app/view/group/group.js
+++ b/web/gui/src/main/webapp/app/view/group/group.js
@@ -37,6 +37,8 @@
             fs = _fs_;
             tbs = _tbs_;
             ns = _ns_;
+            $scope.flowTip = 'Show flow view for this device';
+            $scope.portTip = 'Show port view for this device';
 
             params = $location.search();
             if (params.hasOwnProperty('devId')) {
diff --git a/web/gui/src/main/webapp/app/view/host/host.html b/web/gui/src/main/webapp/app/view/host/host.html
index 0baeccd..c5f98e7 100644
--- a/web/gui/src/main/webapp/app/view/host/host.html
+++ b/web/gui/src/main/webapp/app/view/host/host.html
@@ -5,6 +5,7 @@
         <div class="ctrl-btns">
             <div class="refresh" ng-class="{active: autoRefresh}"
                  icon icon-size="36" icon-id="refresh"
+                 tooltip tt-msg="autoRefreshTip"
                  ng-click="toggleRefresh()"></div>
         </div>
     </div>
diff --git a/web/gui/src/main/webapp/app/view/intent/intent.html b/web/gui/src/main/webapp/app/view/intent/intent.html
index 9c754fd..c065285 100644
--- a/web/gui/src/main/webapp/app/view/intent/intent.html
+++ b/web/gui/src/main/webapp/app/view/intent/intent.html
@@ -21,6 +21,7 @@
         <div class="ctrl-btns">
             <div class="refresh" ng-class="{active: autoRefresh}"
                  icon icon-size="36" icon-id="refresh"
+                 tooltip tt-msg="autoRefreshTip"
                  ng-click="toggleRefresh()"></div>
         </div>
     </div>
diff --git a/web/gui/src/main/webapp/app/view/link/link.html b/web/gui/src/main/webapp/app/view/link/link.html
index 1431772..595a1f7 100644
--- a/web/gui/src/main/webapp/app/view/link/link.html
+++ b/web/gui/src/main/webapp/app/view/link/link.html
@@ -21,6 +21,7 @@
         <div class="ctrl-btns">
             <div class="refresh" ng-class="{active: autoRefresh}"
                  icon icon-size="36" icon-id="refresh"
+                 tooltip tt-msg="autoRefreshTip"
                  ng-click="toggleRefresh()"></div>
         </div>
     </div>
diff --git a/web/gui/src/main/webapp/app/view/port/port.html b/web/gui/src/main/webapp/app/view/port/port.html
index 326aebb..ebf5311 100644
--- a/web/gui/src/main/webapp/app/view/port/port.html
+++ b/web/gui/src/main/webapp/app/view/port/port.html
@@ -24,12 +24,14 @@
         <div class="ctrl-btns">
             <div class="refresh" ng-class="{active: autoRefresh}"
                  icon icon-size="36" icon-id="refresh"
+                 tooltip tt-msg="autoRefreshTip"
                  ng-click="toggleRefresh()"></div>
 
             <div class="separator"></div>
 
             <div class="active"
                  icon icon-id="flowTable" icon-size="36"
+                 tooltip tt-msg="flowTip"
                  ng-click="nav('flow')"></div>
 
             <div class="current-view"
@@ -37,6 +39,7 @@
 
             <div class="active"
                  icon icon-id="groupTable" icon-size="36"
+                 tooltip tt-msg="groupTip"
                  ng-click="nav('group')"></div>
         </div>
     </div>
diff --git a/web/gui/src/main/webapp/app/view/port/port.js b/web/gui/src/main/webapp/app/view/port/port.js
index 9cb8a04..a157c5b 100644
--- a/web/gui/src/main/webapp/app/view/port/port.js
+++ b/web/gui/src/main/webapp/app/view/port/port.js
@@ -37,6 +37,8 @@
             fs = _fs_;
             tbs = _tbs_;
             ns = _ns_;
+            $scope.flowTip = 'Show flow view for this device';
+            $scope.groupTip = 'Show group view for this device';
 
             params = $location.search();
             if (params.hasOwnProperty('devId')) {
diff --git a/web/gui/src/main/webapp/app/view/settings/settings.html b/web/gui/src/main/webapp/app/view/settings/settings.html
index c5d87ba..ae909cd 100644
--- a/web/gui/src/main/webapp/app/view/settings/settings.html
+++ b/web/gui/src/main/webapp/app/view/settings/settings.html
@@ -5,6 +5,7 @@
         <div class="ctrl-btns">
             <div class="refresh" ng-class="{active: autoRefresh}"
                  icon icon-size="36" icon-id="refresh"
+                 tooltip tt-msg="autoRefreshTip"
                  ng-click="toggleRefresh()"></div>
         </div>
     </div>