diff --git a/.changeset/soft-lands-take.md b/.changeset/soft-lands-take.md
new file mode 100644
index 0000000000..109ae4b8ee
--- /dev/null
+++ b/.changeset/soft-lands-take.md
@@ -0,0 +1,5 @@
+---
+'hive': patch
+---
+
+Fix dashboard background using different shades of black.
diff --git a/packages/web/app/index.html b/packages/web/app/index.html
index eb444caf2f..ba6848858d 100644
--- a/packages/web/app/index.html
+++ b/packages/web/app/index.html
@@ -22,7 +22,7 @@
     <script src="/__env.js"></script>
   </head>
   <body>
-    <div class="bg-transparent font-sans text-white" id="root"></div>
+    <div class="font-sans text-white" id="root"></div>
     <script type="module" src="/src/main.tsx"></script>
   </body>
 </html>
diff --git a/packages/web/app/src/components/not-found.tsx b/packages/web/app/src/components/not-found.tsx
index 0999b116e4..0aac262cfa 100644
--- a/packages/web/app/src/components/not-found.tsx
+++ b/packages/web/app/src/components/not-found.tsx
@@ -1,5 +1,4 @@
 import ghost from '../../public/images/figures/ghost.svg?url';
-import { Helmet } from 'react-helmet-async';
 import { Button } from '@/components/ui/button';
 import { captureMessage } from '@sentry/react';
 import { useRouter } from '@tanstack/react-router';
@@ -25,24 +24,6 @@ export function NotFound() {
         <Button variant="secondary" onClick={router.history.back}>
           Go back
         </Button>
-
-        <Helmet>
-          <style key="not-found-styles">
-            {`
-            html {
-              background:
-                url(/images/bg-top-shine.svg) no-repeat left top,
-                url(/images/bg-bottom-shine.svg) no-repeat right bottom,
-                #0b0d11;
-            }
-
-            body {
-              background: transparent !important;
-              color: #fcfcfc !important;
-            }
-          `}
-          </style>
-        </Helmet>
       </div>
     </>
   );
diff --git a/packages/web/app/src/components/ui/page-content-layout.tsx b/packages/web/app/src/components/ui/page-content-layout.tsx
index 784b2f35f5..796ad6e51b 100644
--- a/packages/web/app/src/components/ui/page-content-layout.tsx
+++ b/packages/web/app/src/components/ui/page-content-layout.tsx
@@ -34,8 +34,12 @@ type PageLayoutContentProps = {
 const PageLayoutContent = forwardRef<HTMLDivElement, PageLayoutContentProps>(
   ({ children, mainTitlePage, ...props }, ref) => (
     <div ref={ref} className={cn('grow', props.className)} {...props}>
-      <h1 className="mb-2 text-2xl font-semibold">{mainTitlePage}</h1>
-      {mainTitlePage ? <div className="mb-3 h-[1px] w-full bg-gray-700" /> : null}
+      {mainTitlePage ? (
+        <>
+          <h1 className="mb-2 text-2xl font-semibold">{mainTitlePage}</h1>
+          <div className="mb-3 h-[1px] w-full bg-gray-700" />
+        </>
+      ) : null}
       {children}
     </div>
   ),
diff --git a/packages/web/app/src/index.css b/packages/web/app/src/index.css
index 48fdc54309..236e1500b3 100644
--- a/packages/web/app/src/index.css
+++ b/packages/web/app/src/index.css
@@ -203,3 +203,11 @@
 .hive-badge-is-changed:after {
   @apply absolute right-2 size-1.5 rounded-full border border-orange-600 bg-orange-400 content-[''];
 }
+
+#root {
+  background-color: rgb(3 7 17 / var(--tw-bg-opacity, 1)) !important;
+}
+
+#root > * {
+  background-color: rgb(3 7 17 / var(--tw-bg-opacity, 1)) !important;
+}
