diff --git a/css/style.css b/css/style.css
index ee5923b..c845254 100644
--- a/css/style.css
+++ b/css/style.css
@@ -49,10 +49,10 @@ input {
 #sidebar .actions {
 	overflow: hidden;
 }
-#sidebar .actions #export {
+#sidebar .actions .export {
 	margin-right: 4px;
 }
-#sidebar .actions #export:before {
+#sidebar .actions .export:before {
 	content: "\f019";
 	font: 12px FontAwesome;
 	margin-top: 5px;
diff --git a/index.html b/index.html
index 6e2e892..47fdb7a 100644
--- a/index.html
+++ b/index.html
@@ -20,7 +20,8 @@
 		<div id="panel">
 			<div class="inner">
 			<div class="actions">
-				<button id="export" class="button" data-placement="bottom" title="Download JSON"></button>
+				<button class="button export" data-format="json" data-placement="bottom" title="Download JSON"></button>
+				<button class="button export" data-format="html" data-placement="bottom" title="Download HTML"></button>
 				<button id="reset" class="button hidden">Reset</button>
 				<button id="clear" class="button">Clear</button>
 			</div>
diff --git a/js/main.js b/js/main.js
index a7374a0..2515e52 100644
--- a/js/main.js
+++ b/js/main.js
@@ -52,11 +52,17 @@ jQuery(document).ready(function($) {
 	enableTSEplugin();
 	enableCSStransitions();
 
-	$("#export").on("click", function() {
-		var data = form.data("resume");
-		download(JSON.stringify(data, null, "  "), "resume.json", "text/plain");
+	$(".export").on("click", function() {
+        var data, format = $(this).attr("data-format");
+        if(format === "json") {
+            data = JSON.stringify(form.data("resume"), null, " ");
+        }
+        else if(format === "html") {
+            data = iframe.contents().find("html").html();
+        }
+		download(data, "resume." + format, "text/plain");
 	});
-	$("#export").tooltip({
+	$(".export").tooltip({
 		container: "body"
 	});