diff --git a/src/Layout.tsx b/src/Layout.tsx
index 7889d1f..c75672f 100644
--- a/src/Layout.tsx
+++ b/src/Layout.tsx
@@ -2,7 +2,7 @@ import "./index.css";
 
 export default function Layout({ children }: { children: React.ReactNode }) {
   return (
-    <main className="min-h-screen p-8 max-w-6xl mx-auto bg-zinc-900">
+    <main className="min-h-screen p-8 max-w-6xl mx-auto">
       {/*<header className="mb-12">
         <h1 className="text-4xl font-bold">cute.haus</h1>
       </header>*/}
diff --git a/src/index.css b/src/index.css
index f6ead4a..4e1cca7 100644
--- a/src/index.css
+++ b/src/index.css
@@ -1,5 +1,10 @@
 @import "tailwindcss";
 
 body {
-    background: #18181b;
+    background:
+        radial-gradient(ellipse 120% 80% at 0% 0%, rgba(244, 63, 94, 0.12), transparent 70%),
+        radial-gradient(ellipse 120% 80% at 100% 100%, rgba(99, 102, 241, 0.12), transparent 70%),
+        linear-gradient(to bottom, #18181b, #0c0c0e);
+    background-attachment: fixed;
+    min-height: 100vh;
 }