diff --git a/src/index.tsx b/src/index.tsx
index 51c0d90..98c629e 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -6,7 +6,7 @@ import Particles, { initParticlesEngine } from "@tsparticles/react";
 import { loadSlim } from "@tsparticles/slim";
 
 import { useEffect, useState } from "preact/compat";
-import { ThemeProvider } from "./components/ThemeProvider";
+import { ThemeProvider, useTheme } from "./components/ThemeProvider";
 
 const Routes = lazy(() => import("./routes"));
 
@@ -14,7 +14,7 @@ const particlesUrl = localStorage.getItem("particles") || "none";
 
 export default function App() {
   const [init, setInit] = useState(false);
-
+  const {background} = useTheme();
   // this should be run only once per application lifetime
   useEffect(() => {
     initParticlesEngine(async (engine) => {
@@ -33,7 +33,7 @@ export default function App() {
     console.log(container);
   };
   return (
-    <div>
+    <div className={!background && "bg-primary"}>
       {window.location.origin === "https://nebulaproxy.io" && <Meta />}
       {/* {window.location.origin === "http://localhost:8080" && <Meta />} */}
       <Suspense fallback={<LoadSuspense />}>
diff --git a/src/style.css b/src/style.css
index 454bc6c..71a7c5c 100644
--- a/src/style.css
+++ b/src/style.css
@@ -6,7 +6,6 @@
 @layer base {
   :root,
   .main {
-    --background-image: url();
     --background-primary: #191724;
     --background-lighter: #16121f;
     --navbar-color: #26233a;