diff --git a/mindplot/src/main/javascript/widget/IconPanel.js b/mindplot/src/main/javascript/widget/IconPanel.js
index 36e9b9ea..1561eac3 100644
--- a/mindplot/src/main/javascript/widget/IconPanel.js
+++ b/mindplot/src/main/javascript/widget/IconPanel.js
@@ -28,7 +28,7 @@ mindplot.widget.IconPanel = new Class({
     },
 
     buildPanel:function () {
-        var content = $('<div class="toolbarPanel" id="IconsPanel"></div>').css({width: 253, height: 230});
+        var content = $('<div class="toolbarPanel" id="IconsPanel"></div>').css({width: 245, height: 230});
         content.on('click', function (event) {
             event.stopPropagation()
         });
diff --git a/mindplot/src/main/javascript/widget/ToolbarPaneItem.js b/mindplot/src/main/javascript/widget/ToolbarPaneItem.js
index 585a98ee..673d810b 100644
--- a/mindplot/src/main/javascript/widget/ToolbarPaneItem.js
+++ b/mindplot/src/main/javascript/widget/ToolbarPaneItem.js
@@ -46,7 +46,8 @@ mindplot.widget.ToolbarPaneItem = new Class({
                 return me._updateSelectedItem();
             },
             className: 'toolbarPaneTip',
-            trigger: 'manual'
+            trigger: 'manual',
+            template: '<div class="popover popoverGray" role="tooltip"><div class="arrow arrowGray"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>'
         });
 
         this._tip.addEvent('hide', function() {
diff --git a/wise-editor/src/main/webapp/css/editor.less b/wise-editor/src/main/webapp/css/editor.less
index dd8f5eed..395cbabe 100644
--- a/wise-editor/src/main/webapp/css/editor.less
+++ b/wise-editor/src/main/webapp/css/editor.less
@@ -153,6 +153,15 @@ div.shareModalDialog {
 
 .popoverBlack.bottom .arrow:after{
   border-bottom-color: black;
-
+}
+
+.popoverGray {
+  background: #e4e2d2;
+  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2);
+  border: 3px double #bebebe;
+}
+
+.popoverGray.bottom .arrow:after{
+  border-bottom-color: #e4e2d2;
 }