diff --git a/core/images/cancel-button.svg b/core/images/cancel-button.svg
new file mode 100644
index 0000000000..4495094bed
--- /dev/null
+++ b/core/images/cancel-button.svg
@@ -0,0 +1,3 @@
+<?xml version="1.0"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xl="http://www.w3.org/1999/xlink" version="1.1" viewBox="366 150 58 58" width="22pt" height="22pt"><g stroke="none" stroke-opacity="1" stroke-dasharray="none" fill="none" fill-opacity="1"><g><title>Layer 1</title><path d="M 414.76236 158.98764 C 403.77887 148.0041 385.97113 148.0041 374.98764 158.98764 C 364.0041 169.97113 364.0041 187.77887 374.98764 198.76236 C 385.97113 209.7459 403.77887 209.7459 414.76236 198.76236 C 425.7459 187.77887 425.7459 169.97113 414.76236 158.98764 M 385.3967 165.32954 L 385.3967 165.32954 L 394.77674 174.7096 L 404.3533 165.13303 C 405.53068 163.95566 407.4396 163.95566 408.61697 165.13303 C 409.79434 166.31041 409.79434 168.21932 408.61697 169.39669 L 399.0404 178.97325 L 408.42046 188.35331 C 409.59783 189.53068 409.59783 191.43959 408.42046 192.61697 L 408.42046 192.61697 C 407.24308 193.79434 405.33417 193.79434 404.1568 192.61697 L 394.77675 183.23692 L 385.5932 192.42046 C 384.41583 193.59783 382.50692 193.59783 381.32954 192.42046 L 381.32954 192.42046 C 380.15217 191.24308 380.15217 189.33417 381.32954 188.1568 C 381.32954 188.1568 381.32954 188.1568 381.32954 188.1568 L 381.32954 188.1568 L 381.32954 188.1568 L 390.51309 178.97326 L 381.13303 169.5932 C 379.95566 168.41583 379.95566 166.50692 381.13303 165.32954 L 381.13303 165.32954 C 382.3104 164.15217 384.21932 164.15217 385.3967 165.32954 C 385.3967 165.32954 385.3967 165.32954 385.3967 165.32954 Z" fill="#ccc"/></g></g></svg>
diff --git a/core/images/cancel-button.svg.meta b/core/images/cancel-button.svg.meta
new file mode 100644
index 0000000000..68afb96f03
--- /dev/null
+++ b/core/images/cancel-button.svg.meta
@@ -0,0 +1,2 @@
+title: $:/core/images/cancel-button.svg
+type: image/svg+xml
diff --git a/core/images/delete-button.svg b/core/images/delete-button.svg
new file mode 100644
index 0000000000..24ccc597f1
--- /dev/null
+++ b/core/images/delete-button.svg
@@ -0,0 +1,3 @@
+<?xml version="1.0"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xl="http://www.w3.org/1999/xlink" version="1.1" viewBox="303 155 39 50" width="17pt" height="22pt"><g stroke="none" stroke-opacity="1" stroke-dasharray="none" fill="none" fill-opacity="1"><g><title>Layer 1</title><path d="M 333 164.25 L 333 157.25 C 333 156.14543 332.10457 155.25 331 155.25 L 314.75 155.25 C 314.75 155.25 314.75 155.25 314.75 155.25 C 313.64543 155.25 312.75 156.14543 312.75 157.25 L 312.75 164.25 L 303.75 164.25 L 303.75 168.75 L 306 168.75 L 306 201.75 L 306 201.75 L 306 201.75 C 306 203.40685 307.34315 204.75 309 204.75 L 336.75 204.75 C 338.40685 204.75 339.75 203.40685 339.75 201.75 L 339.75 168.75 L 342 168.75 L 342 164.25 Z M 317.25 160.75 L 317.25 160.75 C 317.25 160.19772 317.69772 159.75 318.25 159.75 C 318.25 159.75 318.25 159.75 318.25 159.75 L 327.5 159.75 C 328.05228 159.75 328.5 160.19772 328.5 160.75 L 328.5 164.25 L 317.25 164.25 L 317.25 160.75 Z M 310.5 168.75 L 312.75 168.75 L 312.75 200.25 L 310.5 200.25 Z M 317.25 168.75 L 319.5 168.75 L 319.5 200.25 L 317.25 200.25 Z M 324 168.75 L 326.25 168.75 L 326.25 200.25 L 324 200.25 Z M 330.75 168.75 L 333 168.75 L 333 200.25 L 330.75 200.25 Z" fill="#ccc"/></g></g></svg>
diff --git a/core/images/delete-button.svg.meta b/core/images/delete-button.svg.meta
new file mode 100644
index 0000000000..76a420869b
--- /dev/null
+++ b/core/images/delete-button.svg.meta
@@ -0,0 +1,2 @@
+title: $:/core/images/delete-button.svg
+type: image/svg+xml
diff --git a/core/images/done-button.svg b/core/images/done-button.svg
new file mode 100644
index 0000000000..b5e507a86e
--- /dev/null
+++ b/core/images/done-button.svg
@@ -0,0 +1,3 @@
+<?xml version="1.0"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xl="http://www.w3.org/1999/xlink" version="1.1" viewBox="369 153 54 54" width="22pt" height="22pt"><g stroke="none" stroke-opacity="1" stroke-dasharray="none" fill="none" fill-opacity="1"><g><title>Layer 1</title><path d="M 369 202 L 369 202 C 369 204.76142 371.23858 207 374 207 L 418 207 C 420.76142 207 423 204.76142 423 202 L 423 158 C 423 155.23858 420.76142 153 418 153 L 374 153 C 374 153 374 153 374 153 C 371.23858 153 369 155.23858 369 158 L 369 202 C 369 202 369 202 369 202 Z M 380.12132 177.87868 L 380.37868 177.62132 C 381.55025 176.44975 383.44975 176.44975 384.62132 177.62132 L 389.37868 182.37868 C 390.55025 183.55025 392.44975 183.55025 393.62132 182.37868 L 409.62868 166.37132 C 410.80025 165.19975 412.69975 165.19975 413.87132 166.37132 L 414.12868 166.62868 C 415.30025 167.80025 415.30025 169.69975 414.12868 170.87132 L 393.62132 191.37868 C 392.44975 192.55025 390.55025 192.55025 389.37868 191.37868 L 380.12132 182.12132 C 378.94975 180.94975 378.94975 179.05025 380.12132 177.87868 C 380.12132 177.87868 380.12132 177.87868 380.12132 177.87868 L 380.12132 177.87868 Z" fill="#ccc"/></g></g></svg>
diff --git a/core/images/done-button.svg.meta b/core/images/done-button.svg.meta
new file mode 100644
index 0000000000..d7f5a19c25
--- /dev/null
+++ b/core/images/done-button.svg.meta
@@ -0,0 +1,2 @@
+title: $:/core/images/done-button.svg
+type: image/svg+xml
diff --git a/core/modules/widgets/navigator.js b/core/modules/widgets/navigator.js
index a71ceb0720..b6517bc03d 100644
--- a/core/modules/widgets/navigator.js
+++ b/core/modules/widgets/navigator.js
@@ -34,6 +34,7 @@ NavigatorWidget.prototype.generate = function() {
 		{name: "tw-edit-tiddler", handlerObject: this, handlerMethod: "handleEditTiddlerEvent"},
 		{name: "tw-delete-tiddler", handlerObject: this, handlerMethod: "handleDeleteTiddlerEvent"},
 		{name: "tw-save-tiddler", handlerObject: this, handlerMethod: "handleSaveTiddlerEvent"},
+		{name: "tw-cancel-tiddler", handlerObject: this, handlerMethod: "handleCancelTiddlerEvent"},
 		{name: "tw-close-tiddler", handlerObject: this, handlerMethod: "handleCloseTiddlerEvent"},
 		{name: "tw-new-tiddler", handlerObject: this, handlerMethod: "handleNewTiddlerEvent"}
 	];
@@ -214,6 +215,32 @@ NavigatorWidget.prototype.handleSaveTiddlerEvent = function(event) {
 	return false;
 };
 
+// Take a tiddler out of edit mode without saving the changes
+NavigatorWidget.prototype.handleCancelTiddlerEvent = function(event) {
+	this.getStoryList();
+	var storyTiddlerModified = false;
+	for(var t=0; t<this.storyList.length; t++) {
+		if(this.storyList[t] === event.tiddlerTitle) {
+			var tiddler = this.renderer.renderTree.wiki.getTiddler(event.tiddlerTitle);
+			if(tiddler.hasField("draft.title")) {
+				// Remove the draft tiddler
+				this.renderer.renderTree.wiki.deleteTiddler(event.tiddlerTitle);
+				// Make the story record point to the original tiddler
+				this.storyList[t] = tiddler.fields["draft.title"];
+				// Check if we're modifying the story tiddler itself
+				if(tiddler.fields["draft.title"] === this.storyTitle) {
+					storyTiddlerModified = true;
+				}
+			}
+		}
+	}
+	if(!storyTiddlerModified) {
+		this.saveStoryList();
+	}
+	event.stopPropagation();
+	return false;
+};
+
 // Create a new draft tiddler
 NavigatorWidget.prototype.handleNewTiddlerEvent = function(event) {
 	// Get the story details
diff --git a/core/templates/EditTemplate.tid b/core/templates/EditTemplate.tid
index 5f82dfe10b..4de5a1f14a 100644
--- a/core/templates/EditTemplate.tid
+++ b/core/templates/EditTemplate.tid
@@ -1,7 +1,9 @@
 title: $:/templates/EditTemplate
 modifier: JeremyRuston
 
-<$view field="title"/> <$button message="tw-delete-tiddler" class="btn btn-mini btn-success">delete</$button> <$button message="tw-save-tiddler" class="btn btn-mini btn-success">done</$button>
+<span class="tw-tiddler-controls"> <$button message="tw-delete-tiddler" class="btn-invisible">{{$:/core/images/delete-button.svg}}</$button> <$button message="tw-cancel-tiddler" class="btn-invisible">{{$:/core/images/cancel-button.svg}}</$button> <$button message="tw-save-tiddler" class="btn-invisible">{{$:/core/images/done-button.svg}}</$button> </span>
+
+<$view field="title"/> 
 
 @@.title
 <$edit field="draft.title"/>