diff --git a/src/themes/main.css b/public/themes/main.css
similarity index 96%
rename from src/themes/main.css
rename to public/themes/main.css
index 472676d..4225b6c 100644
--- a/src/themes/main.css
+++ b/public/themes/main.css
@@ -1,28 +1,28 @@
-@import url("https://fonts.googleapis.com/css2?family=Dongle&family=Roboto:wght@100&display=swap");
-
-:root {
-  --background-primary: #191724;
-  --background-lighter: #16121f;
-  --navbar-color: #26233a;
-  --navbar-height: 60px;
-  --navbar-text-color: #7967dd;
-  --navbar-link-color: #e0def4;
-  --navbar-link-hover-color: gray;
-  --navbar-font: "Roboto";
-  --input-text-color: #e0def4;
-  --input-placeholder-color: white;
-  --input-background-color: #1f1d2e;
-  --input-border-color: #eb6f92;
-  --input-border-size: 1.3px;
-  --navbar-logo-filter: none;
-  --dropdown-option-hover-color: #312a49;
-}
-
-.font-inter {
-  font-family: "Inter", sans-serif;
-  font-weight: 300;
-}
-
-.font-roboto {
-  font-family: "Roboto";
-}
+@import url("https://fonts.googleapis.com/css2?family=Dongle&family=Roboto:wght@100&display=swap");
+
+:root {
+  --background-primary: #191724;
+  --background-lighter: #16121f;
+  --navbar-color: #26233a;
+  --navbar-height: 60px;
+  --navbar-text-color: #7967dd;
+  --navbar-link-color: #e0def4;
+  --navbar-link-hover-color: gray;
+  --navbar-font: "Roboto";
+  --input-text-color: #e0def4;
+  --input-placeholder-color: white;
+  --input-background-color: #1f1d2e;
+  --input-border-color: #eb6f92;
+  --input-border-size: 1.3px;
+  --navbar-logo-filter: none;
+  --dropdown-option-hover-color: #312a49;
+}
+
+.font-inter {
+  font-family: "Inter", sans-serif;
+  font-weight: 300;
+}
+
+.font-roboto {
+  font-family: "Roboto";
+}
diff --git a/public/themes/mocha.css b/public/themes/mocha.css
new file mode 100644
index 0000000..2c29f72
--- /dev/null
+++ b/public/themes/mocha.css
@@ -0,0 +1,28 @@
+@import url("https://fonts.googleapis.com/css2?family=Dongle&family=Roboto:wght@100&display=swap");
+
+:root [data-theme="mocha"] {
+    --background-primary: #1e1e2e;
+    --background-lighter: #11111b;
+    --navbar-color: #11111b;
+    --navbar-height: 60px;
+    --navbar-text-color: #cba6f7;
+    --navbar-link-color: #89b4fa;
+    --navbar-link-hover-color: #cba6f7;
+    --navbar-font: "Roboto";
+    --input-text-color: #cdd6f4;
+    --input-placeholder-color: #bac2de;
+    --input-background-color: #181825;
+    --input-border-color: #cba6f7;
+    --input-border-size: 1.3px;
+    --navbar-logo-filter: none;
+    --dropdown-option-hover-color: #11111b;
+}
+
+.font-inter {
+    font-family: "Inter", sans-serif;
+    font-weight: 300;
+}
+
+.font-roboto {
+    font-family: "Roboto";
+}
diff --git a/src/components/iframe/IframeHeader.tsx b/src/components/iframe/IframeHeader.tsx
index 95c5124..848128b 100644
--- a/src/components/iframe/IframeHeader.tsx
+++ b/src/components/iframe/IframeHeader.tsx
@@ -97,7 +97,12 @@ export function IframeHeader(props: { url: string }) {
                 script.src = "https://cdn.jsdelivr.net/npm/eruda";
                 script.onload = function () {
                   if (!proxyWindow) return;
-                  proxyWindow.eruda.init();
+                  proxyWindow.eruda.init({
+                    defaults: {
+                      displaySize: 45,
+                      theme: 'Material Palenight'
+                    }
+                  });
                   proxyWindow.eruda.show();
                 };
                 proxyDocument.head.appendChild(script);
diff --git a/src/index.tsx b/src/index.tsx
index e17fecb..5ed3911 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -1,4 +1,4 @@
-import { render } from "preact";
+import { render, Component } from "preact";
 import { Suspense, lazy } from "preact/compat";
 import { LoadSuspense } from "./LoadSuspense";
 const Routes = lazy(() => import("./routes"));
diff --git a/src/routes.tsx b/src/routes.tsx
index 9a0feaf..138c227 100644
--- a/src/routes.tsx
+++ b/src/routes.tsx
@@ -6,14 +6,14 @@ import { ProxyFrame } from "./pages/ProxyFrame.js";
 import { Radon } from "./pages/Radon";
 import { Settings } from "./pages/Settings/";
 import { AboutBlank } from "./AboutBlank";
-import AutocompleteInput from "./Autocomplete";
+//import AutocompleteInput from "./Autocomplete";
 import "./style.css";
-import "./themes/main.css";
 import "./i18n";
 
 export default function Routes() {
   return (
     <LocationProvider>
+      <link rel="stylesheet" href="/themes/main.css" />
       <Router>
         <Route path="/" component={Home} />
         <Route path="/discord" component={DiscordPage} />