diff --git a/octoprint/server.py b/octoprint/server.py
index 5fde4a9..43a00b0 100644
--- a/octoprint/server.py
+++ b/octoprint/server.py
@@ -202,6 +202,10 @@ def jog():
 	if "homeZ" in request.values.keys():
 		# home z
 		printer.command("G28 Z0")
+	if "extrude" in request.values.keys():
+		# extrude/retract
+		length = request.values["extrude"]
+		printer.commands(["G91", "G1 E" + length + " F300", "G90"])
 
 	return jsonify(SUCCESS)
 
diff --git a/octoprint/static/css/ui.css b/octoprint/static/css/ui.css
index 5188b91..f1f9c79 100644
--- a/octoprint/static/css/ui.css
+++ b/octoprint/static/css/ui.css
@@ -144,4 +144,39 @@ table th.timelapse_files_action, table td.timelapse_files_action {
 
 .overflow_visible {
     overflow: visible !important;
+}
+
+#controls {
+    overflow: hidden;
+}
+
+#controls .jog-panel {
+    float: left;
+    margin-right: 20px;
+}
+
+#controls .jog-panel > h4 {
+    border-bottom: 1px solid #ddd;
+}
+
+#controls .jog-panel > div {
+    text-align: center;
+}
+
+#controls .box {
+    width: 40px;
+    height: 40px;
+    margin-right: 20px;
+    margin-bottom: 20px;
+}
+
+#controls .control-box {
+    display: block;
+    height: 40px;
+    margin-right: 20px;
+    margin-bottom: 20px;
+}
+
+.text-right {
+    text-align: right;
 }
\ No newline at end of file
diff --git a/octoprint/static/js/ui.js b/octoprint/static/js/ui.js
index 2c88413..ddd5b2d 100644
--- a/octoprint/static/js/ui.js
+++ b/octoprint/static/js/ui.js
@@ -355,6 +355,7 @@ function ControlsViewModel() {
     self.isReady = ko.observable(undefined);
     self.isLoading = ko.observable(undefined);
 
+    self.extrusionAmount = ko.observable(undefined);
     self.controls = ko.observableArray([]);
 
     self.fromCurrentData = function(data) {
@@ -426,6 +427,26 @@ function ControlsViewModel() {
         })
     }
 
+    self.sendExtrudeCommand = function() {
+        self._sendECommand(1);
+    }
+
+    self.sendRetractCommand = function() {
+        self._sendECommand(-1);
+    }
+
+    self._sendECommand = function(dir) {
+        var length = self.extrusionAmount();
+        if (!length)
+            length = 5;
+        $.ajax({
+            url: AJAX_BASEURL + "control/jog",
+            type: "POST",
+            dataType: "json",
+            data: "extrude=" + (dir * length)
+        })
+    }
+
     self.sendCustomCommand = function(command) {
         if (!command)
             return;
diff --git a/octoprint/templates/index.html b/octoprint/templates/index.html
index 8bedf3e..ff08e4c 100644
--- a/octoprint/templates/index.html
+++ b/octoprint/templates/index.html
@@ -169,26 +169,58 @@
                             </div>
                         </div>
                         <div class="tab-pane" id="controls">
-                            <div style="width: 350px; height: 70px">
-                                <div style="width: 70px; float: left;">&nbsp;</div>
-                                <div style="width: 70px; float: left;"><button class="btn btn-block" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendJogCommand('y', 10) }">Y+</button></div>
-                                <div style="width: 70px; float: left;">&nbsp;</div>
-                                <div style="width: 70px; float: left; margin-left: 20px"><button class="btn btn-block" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendJogCommand('z', 10) }">Z+</button></div>
+                            <!-- XY jogging control panel -->
+                            <div class="jog-panel">
+                                <h1>X/Y</h1>
+                                <div>
+                                    <button class="btn box" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendJogCommand('y', 10) }"><i class="icon-arrow-up"></i></button>
+                                </div>
+                                <div>
+                                    <button class="btn box" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendJogCommand('x', -10) }"><i class="icon-arrow-left"></i></button>
+                                    <button class="btn box" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendHomeCommand('XY') }"><i class="icon-home"></i></button>
+                                    <button class="btn box" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendJogCommand('x', 10) }"><i class="icon-arrow-right"></i></button>
+                                </div>
+                                <div>
+                                    <button class="btn box" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendJogCommand('y', -10) }"><i class="icon-arrow-down"></i></button>
+                                </div>
                             </div>
-                            <div style="width: 350px; height: 70px">
-                                <div style="width: 70px; float: left;"><button class="btn btn-block" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendJogCommand('x', -10) }">X-</button></div>
-                                <div style="width: 70px; float: left;"><button class="btn btn-block" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendHomeCommand('XY') }">Home</button></div>
-                                <div style="width: 70px; float: left;"><button class="btn btn-block" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendJogCommand('x', 10) }">X+</button></div>
-                                <div style="width: 70px; float: left; margin-left: 20px"><button class="btn btn-block" id="jog_z_home" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendHomeCommand('Z') }">Home</button></div>
+                            <!-- Z jogging control panel -->
+                            <div class="jog-panel">
+                                <h1>Z</h1>
+                                <div>
+                                    <button class="btn box" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendJogCommand('z', 10) }"><i class="icon-arrow-up"></i></button>
+                                </div>
+                                <div>
+                                    <button class="btn box" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendHomeCommand('Z') }"><i class="icon-home"></i></button>
+                                </div>
+                                <div>
+                                    <button class="btn box" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendJogCommand('z', -10) }"><i class="icon-arrow-down"></i></button>
+                                </div>
                             </div>
-                            <div style="width: 350px; height: 70px">
-                                <div style="width: 70px; float: left;">&nbsp;</div>
-                                <div style="width: 70px; float: left;"><button class="btn btn-block" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendJogCommand('y', -10) }">Y-</button></div>
-                                <div style="width: 70px; float: left;">&nbsp;</div>
-                                <div style="width: 70px; float: left; margin-left: 20px"><button class="btn btn-block" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendJogCommand('z', -10) }">Z-</button></div>
+                            <!-- Extrusion control panel -->
+                            <div class="jog-panel">
+                                <h1>E</h1>
+                                <div>
+                                    <div class="input-append control-box">
+                                        <input type="text" class="input-mini text-right" data-bind="value: extrusionAmount, enable: isOperational() && !isPrinting(), attr: {placeholder: 5}">
+                                        <span class="add-on">mm</span>
+                                    </div>
+                                    <button class="btn control-box" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendExtrudeCommand() }">Extrude</button>
+                                    <button class="btn control-box" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendRetractCommand() }">Retract</button>
+                                </div>
+                            </div>
+                            <!-- General control panel -->
+                            <div class="jog-panel">
+                                <h1>General</h1>
+                                <div>
+                                    <button class="btn control-box" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendCustomCommand({type:'command',command:'M18'}) }"><i class="icon-off"></i>&nbsp;Motors off</button>
+                                    <button class="btn control-box" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendCustomCommand({type:'command',command:'M106'}) }">Fans on</button>
+                                    <button class="btn control-box" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendCustomCommand({type:'command',command:'M106 S0'}) }">Fans off</button>
+                                </div>
                             </div>
 
-                            <div data-bind="template: { name: $root.displayMode, foreach: controls }"></div>
+                            <!-- Container for custom controls -->
+                            <div style="clear: both;" data-bind="template: { name: $root.displayMode, foreach: controls }"></div>
 
                             <!-- Templates for custom controls -->
                             <script type="text/html" id="customControls_sectionTemplate">
@@ -433,4 +465,4 @@
         <!--<script type="text/javascript" src="{{ url_for('static', filename='gcodeviewer/lib/jquery-ui-1.9.0.custom.js') }}"></script>-->
 
     </body>
-</html>
\ No newline at end of file
+</html>