diff --git a/index.html b/index.html
index cf25ea65..e8efc7a9 100644
--- a/index.html
+++ b/index.html
@@ -97,6 +97,7 @@
     <div class="buttons-box">
       <button class="submit"><strong>Beautify Code</strong> <em>(ctrl&#8209;enter)</em></button>
       <button class="control" type="button" onclick="copyText()"><strong>Copy to Clipboard</strong></button>
+      <button class="control" type="button" onclick="downloadBeautifiedCode()"><strong>Download</strong></button>
       <button class="control" type="button" onclick="selectAll()"><strong>Select All</strong></button>
       <button class="control" type="button" onclick="clearAll()"><strong>Clear</strong></button>
       <input type="file" onchange="changeToFileContent(this)">
diff --git a/web/common-function.js b/web/common-function.js
index 5d644e52..34ff0957 100644
--- a/web/common-function.js
+++ b/web/common-function.js
@@ -150,6 +150,40 @@ function unpacker_filter(source) {
   return leading_comments + source;
 }
 
+/* exported downloadBeautifiedCode */
+function downloadBeautifiedCode() {
+  var content = the.editor ? the.editor.getValue() : $('#source').val();
+
+  // Getting the selected language to determine the file extension
+  var language = $('#language').val();
+  var fileExtension = "txt"; // Default extension
+
+  // Setting the  file extension based on the selected language
+  if (language === 'html') {
+    fileExtension = 'html';
+  } else if (language === 'css') {
+    fileExtension = 'css';
+  } else if (language === 'js') {
+    fileExtension = 'js';
+  }
+
+  // Creating a Blob object with the content
+  var blob = new Blob([content], { type: "text/plain;charset=utf-8" });
+
+  // Creating a temporary anchor element to trigger the download
+  var link = document.createElement("a");
+  link.href = URL.createObjectURL(blob);
+  try {
+    link.download = "beautified." + fileExtension; // Dynamic file name based on extension
+
+    // Triggering the download
+    link.click();
+  } finally {
+    // Cleanup
+    URL.revokeObjectURL(link.href);
+  }
+}
+
 
 function beautify() {
   if (the.beautify_in_progress) {
diff --git a/web/onload.js b/web/onload.js
index 8e5ac0cb..11b03602 100644
--- a/web/onload.js
+++ b/web/onload.js
@@ -55,4 +55,6 @@ $(function() {
   $('#additional-options').change(beautify);
 
 
+
+
 });