diff --git a/src/App.tsx b/src/App.tsx
index 32f2d13..45ea1f8 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -7,6 +7,7 @@ import MainPage from "./dom-components/MainPage";
 import Guide from "./dom-components/Guide";
 import Keybinding from "./dom-components/Keybinding";
 import { useStore } from "./store";
+import Savefile from "./dom-components/Savefile";
 
 const App = () => {
   const setKeybindings = useStore((state) => state.setKeybindings);
@@ -24,6 +25,7 @@ const App = () => {
         <Route path={"/game"} exact component={Game} />
         <Route path={"/guide"} exact component={Guide} />
         <Route path={"/keybinding"} exact component={Keybinding} />
+        <Route path={"/savefile"} exact component={Savefile} />
       </Switch>
     </HashRouter>
   );
diff --git a/src/dom-components/Game.tsx b/src/dom-components/Game.tsx
index 9f6bb3c..1f84323 100644
--- a/src/dom-components/Game.tsx
+++ b/src/dom-components/Game.tsx
@@ -50,17 +50,6 @@ const Game = () => {
 
   const handleWindowKeypress = useCallback((event) => {
     switch (event.key) {
-      case "l":
-        const saveState = prompt(
-          `This is your current save state. It's empty if you haven't saved the game yet. To export it, just copy this value and save it somewhere, to import another one, simply replace it and click ok. 
-          \n If you wish to reset your progress, simply delete it and click ok.
-          \n Keep in mind replacing this with something other than a save state/manually modifying it without being careful will result in a crash upon trying to load it.`,
-          localStorage.getItem("lainSaveState") || undefined
-        );
-
-        localStorage.setItem("lainSaveState", saveState || "");
-
-        break;
       case "k":
         setWidth((prevWidth) => prevWidth * 1.1);
         setHeight((prevHeight) => prevHeight * 1.1);
diff --git a/src/dom-components/Header.tsx b/src/dom-components/Header.tsx
index 1aac193..80c5334 100644
--- a/src/dom-components/Header.tsx
+++ b/src/dom-components/Header.tsx
@@ -11,6 +11,7 @@ const Header = () => {
       <Link to="/guide">guide</Link>
       <a href="https://discord.com/invite/W22Ga2R">discord</a>
       <Link to="/keybinding">keybinding</Link>
+      <Link to="/savefile">savefile</Link>
     </div>
   );
 };
diff --git a/src/dom-components/Notes.tsx b/src/dom-components/Notes.tsx
index 64da758..726ae7f 100644
--- a/src/dom-components/Notes.tsx
+++ b/src/dom-components/Notes.tsx
@@ -165,10 +165,6 @@ const Notes = () => {
                     <td>j</td>
                     <td>Downscale Game Window</td>
                   </tr>
-                  <tr>
-                    <td>l</td>
-                    <td>Save Manager</td>
-                  </tr>
                 </tbody>
               </table>
               <br />
diff --git a/src/dom-components/Savefile.tsx b/src/dom-components/Savefile.tsx
new file mode 100644
index 0000000..c3ca4c5
--- /dev/null
+++ b/src/dom-components/Savefile.tsx
@@ -0,0 +1,49 @@
+import React, { useCallback, useEffect, useState } from "react";
+import "../static/css/savefile.css";
+import Header from "./Header";
+
+const Savefile = () => {
+  const [textAreaValue, setTextAreaValue] = useState("");
+
+  useEffect(() => {
+    setTextAreaValue(localStorage.getItem("lainSaveState") || "");
+  }, []);
+
+  const saveState = useCallback(() => {
+    if (textAreaValue) localStorage.setItem("lainSaveState", textAreaValue);
+    else localStorage.setItem("lainSaveState", "");
+  }, [textAreaValue]);
+
+  const handleTextValueChange = useCallback((e) => {
+    setTextAreaValue(e.target.value);
+  }, []);
+
+  return (
+    <>
+      <Header />
+      <div className="savefile-wrapper">
+        <p className="savefile-note">
+          If you've saved the game during the playthrough, the text provided in
+          the box below is your "save file". To export it for future use, just
+          copy everything inside it and paste it inside a file somewhere
+          locally. To re-import it later, take the contents of the file, paste
+          them here, and press "Save state". After that, reload the website.
+          <br />
+          <br />
+          If you're here simply to reset your progress, just delete everything
+          inside the textbox below and press "Save state".
+          <br />
+          <br />
+          Keep in mind, manually modifying the contents without being
+          careful/setting it to something random will result in a crash while
+          trying to load the state in-game.
+        </p>
+        <textarea value={textAreaValue} onChange={handleTextValueChange} />
+        <br />
+        <button onClick={saveState}>Save state</button>
+      </div>
+    </>
+  );
+};
+
+export default Savefile;
diff --git a/src/static/css/savefile.css b/src/static/css/savefile.css
new file mode 100644
index 0000000..ffbac74
--- /dev/null
+++ b/src/static/css/savefile.css
@@ -0,0 +1,13 @@
+.savefile-wrapper {
+  display: block;
+  margin: 0 auto;
+  text-align: center;
+}
+
+.savefile-note {
+  text-align: center;
+  font-size: 1.7rem;
+  color: white;
+  padding-left: 5em;
+  padding-right: 5em;
+}
diff --git a/src/utils/getKeyPress.ts b/src/utils/getKeyPress.ts
index 653db29..9e87aa9 100644
--- a/src/utils/getKeyPress.ts
+++ b/src/utils/getKeyPress.ts
@@ -3,7 +3,6 @@ import { useStore } from "../store";
 const getKeyPress = (key: string) => {
   const keybindings = useStore.getState().keybindings;
 
-  console.log(keybindings);
   // make the keybinds work with caps lock on aswell
   if (key.length === 1) key = key.toLowerCase();