diff --git a/src/atlasViewer/atlasViewer.style.css b/src/atlasViewer/atlasViewer.style.css
index 09cb45dcbb631495ffa4d2e991a77a615a98f46c..ceeaff428324886d98881a05a2adfc9aee099e6e 100644
--- a/src/atlasViewer/atlasViewer.style.css
+++ b/src/atlasViewer/atlasViewer.style.css
@@ -122,7 +122,17 @@ div[contextualBlock]
   color:rgba(245,245,245,0.8);
 }
 
-span.tabContainer > *
+.pointer-events
+{
+  pointer-events: all;
+}
+
+.no-pointer-events
+{
+  pointer-events: none;
+}
+
+span.tabContainer > *:not(.pointer-events)
 {
   pointer-events: none;
 }
@@ -195,6 +205,7 @@ span.tabContainer.active-tab:before
   top:0;
   width:100%;
   height:100%;
+  pointer-events: none;
 }
 
 :host-context([darktheme="true"]) span.tabContainer.active-tab:before
diff --git a/src/atlasViewer/atlasViewer.template.html b/src/atlasViewer/atlasViewer.template.html
index 6d515896981614f602f5ee080da21c2808ea7d65..c9306f06e37bf1f4ebb6980a5320e662692777cc 100644
--- a/src/atlasViewer/atlasViewer.template.html
+++ b/src/atlasViewer/atlasViewer.template.html
@@ -97,11 +97,29 @@
 
       <span 
         placement = "left"
-        tooltip = "Tools Browser"
+        (mouseover) = "_toolIconsVisible = true" 
+        (mouseout) = "_toolIconsVisible = false"
+        [tooltip] = "_toolIconDockAll ? 'dock all widgets' : _toolIconFloatAll ? 'float all widgets' : 'Tools Browser'"
         [ngClass] = "{'active-tab' : (sidePanelView$ | async) === 'toolsBrowser'}" 
         (click) = "toggleSidePanel('toolsBrowser')" 
         class = "tabContainer">
         <i class="glyphicon glyphicon-wrench"></i>
+        <span class ="badge">
+          <span [class.hidden] = "_toolIconsVisible" >
+            ...
+          </span>
+          <span [class.hidden] = "!_toolIconsVisible">
+            <span class = "pointer-events" (click) = "$event.stopPropagation();this.widgetServices.dockAllWidgets()" (mouseover) = "_toolIconDockAll = true" (mouseout) = "_toolIconDockAll = false">
+              <i class = "no-pointer-events glyphicon glyphicon-log-in"></i>
+            </span>
+            <span class = "mute-text">
+              |
+            </span>
+            <span class = "pointer-events" (click) = "$event.stopPropagation();this.widgetServices.floatAllWidgets()" (mouseover) = "_toolIconFloatAll = true" (mouseout) = "_toolIconFloatAll = false">
+              <i class = "no-pointer-events glyphicon glyphicon-new-window"></i>
+            </span>
+          </span>
+        </span>
       </span>
     </div>
   </layout-mainside>
diff --git a/src/atlasViewer/widgetUnit/widgetService.service.ts b/src/atlasViewer/widgetUnit/widgetService.service.ts
index 83c180393cf1c2a70208e7165a08293cea6f2662..991020edc29017a7ae963d906c85d87eeb1ed524 100644
--- a/src/atlasViewer/widgetUnit/widgetService.service.ts
+++ b/src/atlasViewer/widgetUnit/widgetService.service.ts
@@ -128,6 +128,15 @@ export class WidgetServices{
       console.warn('widgetref not found')
     }
   }
+
+  dockAllWidgets(){
+    /* nb cannot directly iterate the set, as the set will be updated and create and infinite loop */
+    [...this.widgetComponentRefs].forEach(cr => cr.instance.dock())
+  }
+
+  floatAllWidgets(){
+    [...this.widgetComponentRefs].forEach(cr => cr.instance.undock())
+  }
 }
 
 function safeGetSingle(obj:any, arg:string){