diff --git a/static/css/dicomViewer.css b/static/css/dicomViewer.css
index 53d9c30f..b1966c3d 100644
--- a/static/css/dicomViewer.css
+++ b/static/css/dicomViewer.css
@@ -77,6 +77,13 @@
   right: 50%;
 }
 
+#dicom-collapse-button {
+  position: absolute;
+  transform: translate(0, -50%);
+  top: 50%;
+  right: 0;
+}
+
 #dicom-settings-panel {
   display: none;
   position: absolute;
diff --git a/static/js/dicomViewer.js b/static/js/dicomViewer.js
index 21e87c2c..52913b4b 100644
--- a/static/js/dicomViewer.js
+++ b/static/js/dicomViewer.js
@@ -17,6 +17,7 @@ let tool_state = {};
 export function loadCornerstone(main_element, db, images, annotations_to_load, load_as_stack = false) {
     // canvas-panel holds the enabled elements and all tools / menus
     main_element.append("<div class='canvas-panel'></div>");
+    main_element[0].dataset.collapsed = "none";
     $(".canvas-panel").append($("<div class='single-dicom-viewer'></div>"));
     //$(".canvas-panel").append($("<div id='dicom-summary'></div>").load("dicomSummary.html"));
 
@@ -89,7 +90,8 @@ export function loadCornerstone(main_element, db, images, annotations_to_load, l
     )
         .append($("<span id='dicom-toggle-mode-button' class='dicom-button' title='toggle stack/thumbnail view'>↻</span>"))
         .append($("<span id='dicom-fullscreen-button' class='dicom-button' title='toggle stack/thumbnail view'>⛶</span>"))
-        .append($("<span id='dicom-settings-button' class='dicom-button' title='open settings'>&#9881;</span>"));
+        .append($("<span id='dicom-settings-button' class='dicom-button' title='open settings'>&#9881;</span>"))
+        .append($("<span id='dicom-collapse-button' class='dicom-button' title='collapse viewer'>⇄</span>"));
 
     $(single_dicom_viewer).append(
         $(
@@ -158,6 +160,20 @@ export function loadCornerstone(main_element, db, images, annotations_to_load, l
         loadCornerstone(main_element, db, images, annotations_to_load, stack)
     });
 
+    $("#dicom-collapse-button").click(e => {
+        //$("#dicom-settings-panel").toggle();
+        //let stack = !load_as_stack;
+        if (main_element[0].dataset.collapsed == "none") {
+            main_element[0].dataset.collapsed = main_element.width();
+            main_element.width("50px");
+        } else {
+            main_element.width(main_element[0].dataset.collapsed);
+            main_element[0].dataset.collapsed = "none"
+        }
+        resizeHandler();
+        //loadCornerstone(main_element, db, images, annotations_to_load, stack)
+    });
+
     //let images = data["images"];
 
     // Make sure we have an array