diff --git a/frontend/src/views/files/Editor.vue b/frontend/src/views/files/Editor.vue
index 7e4d7a9b..1ecbe53b 100644
--- a/frontend/src/views/files/Editor.vue
+++ b/frontend/src/views/files/Editor.vue
@@ -41,6 +41,7 @@ import url from "@/utils/url";
 import ace, { Ace, version as ace_version } from "ace-builds";
 import modelist from "ace-builds/src-noconflict/ext-modelist";
 import "ace-builds/src-noconflict/ext-language_tools";
+import "ace-builds/src-noconflict/ext-beautify";
 
 import HeaderBar from "@/components/header/HeaderBar.vue";
 import Action from "@/components/header/Action.vue";
@@ -66,6 +67,7 @@ const route = useRoute();
 const router = useRouter();
 
 const editor = ref<Ace.Editor | null>(null);
+const beautify = ace.require("ace/ext/beautify");
 
 const isPreview = ref(false);
 const previewContent = ref("");
@@ -137,12 +139,19 @@ const keyEvent = (event: KeyboardEvent) => {
     return;
   }
 
-  if (event.key !== "s") {
+  if (event.key !== "s" && event.key !== "B") {
     return;
   }
 
   event.preventDefault();
-  save();
+
+  if (event.key == "s") {
+    save();
+  }
+
+  if (event.key == "B") {
+    beautify.beautify(editor.value?.session);
+  }
 };
 
 const handleScroll = (event: WheelEvent) => {