diff --git a/src/pages/404.astro b/src/pages/404.astro
new file mode 100644
index 0000000..ec6a574
--- /dev/null
+++ b/src/pages/404.astro
@@ -0,0 +1,23 @@
+
+---
+import Layout from "../layouts/Layout.astro";
+import { Icon } from "astro-icon/components";
+const unsortedDocs = await Astro.glob("./docs/*/index.{md,mdx}");
+const docs = unsortedDocs.sort(
+  (a, b) => +new Date(b.frontmatter.date) - +new Date(a.frontmatter.date)
+);
+---
+
+<Layout
+  title="ERROR 404"
+  description="This is my personal website with my projects, docs and other useful stuff."
+>
+  <main>
+    <div class="center">
+        <h1 style="text-align: center;">ERROR 404</h1>
+        <br/>
+        <p style="font-size: 22px;">The page either never existed or was renamed.<br/>
+            Try something in the navabar above!</p>
+    </div>
+    </main>
+</Layout>
diff --git a/src/styles/main.scss b/src/styles/main.scss
index c77c784..47bc2e8 100644
--- a/src/styles/main.scss
+++ b/src/styles/main.scss
@@ -181,3 +181,11 @@ button {
     transform: translateY(1px);
   }
 }
+
+.center {
+  margin: 0;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
\ No newline at end of file