diff --git a/src/pages/404.astro b/src/pages/404.astro
new file mode 100644
index 0000000..c0a25bc
--- /dev/null
+++ b/src/pages/404.astro
@@ -0,0 +1,36 @@
+---
+import Base from "@/layouts/Base.astro";
+import "@/styles/bloodtheme.css";
+import { Font } from "astro:assets";
+---
+
+<Base title="404">
+  <Font cssVariable="--font-silkscreen" slot="head" />
+  <main class="center-txt flex">
+    <div>
+      <h1>ERROR 404</h1>
+      <p>Strayed too far from the light, on a page that does not exist.</p>
+      <p>May one day you find what you are looking for.</p>
+      <p>But for now, <a href="/">return home</a> visitor.</p>
+    </div>
+  </main>
+</Base>
+
+<style>
+  body {
+    background: linear-gradient(var(--c-black), var(--c-medium));
+  }
+
+  main {
+    justify-content: center;
+    align-items: center;
+    min-height: calc(100svh - 2em);
+    padding: 1em;
+  }
+
+  h1 {
+    color: var(--c-accent);
+    font-size: clamp(1.5rem, 2vw, 2rem);
+    font-family: var(--font-silkscreen);
+  }
+</style>
diff --git a/src/styles/bloodtheme.css b/src/styles/bloodtheme.css
new file mode 100644
index 0000000..90cd274
--- /dev/null
+++ b/src/styles/bloodtheme.css
@@ -0,0 +1,18 @@
+:root {
+  --c-black: #121212;
+  --c-medium: #400909;
+  --c-light: #f6da9d;
+  --c-accent: #e7442f;
+  --g-rainbow: var(--c-medium), var(--c-black), var(--c-medium);
+  scrollbar-color: var(--c-light) var(--c-black);
+}
+
+body {
+  background-color: var(--c-black);
+  color: var(--c-light);
+}
+
+a {
+  text-decoration: underline wavy 1px;
+  text-underline-offset: 0.1em;
+}