diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index b9963b5..ddb3c1b 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -51,10 +51,6 @@ function Content() {
           backgroundSize: "100vw 200vh",
           backgroundPosition: "50% 0vh",
           backgroundRepeat: "no-repeat",
-          transition: (t) =>
-            t.transitions.create("background-color", {
-              duration: t.transitions.duration.complex,
-            }),
         }}
       >
         <Box>
diff --git a/src/theme/Navbar/ColorModeToggle/index.js b/src/theme/Navbar/ColorModeToggle/index.js
index 1256158..48dfb6e 100644
--- a/src/theme/Navbar/ColorModeToggle/index.js
+++ b/src/theme/Navbar/ColorModeToggle/index.js
@@ -10,7 +10,6 @@ export default function NavbarColorModeToggle({ className }) {
   if (disabled) {
     return null;
   }
-
   return (
     <Box>
       <IconButton
diff --git a/src/theme/Root.js b/src/theme/Root.js
index 2f3c961..fb3b2f8 100644
--- a/src/theme/Root.js
+++ b/src/theme/Root.js
@@ -6,7 +6,7 @@ import { get, set } from "../components/storage";
 
 // Default implementation, that you can customize
 export default function Root({ children }) {
-  const [mode, setMode] = useState(get("theme") || "light");
+  const [mode, setMode] = useState("light");
   const theme = useMemo(() => makeTheme(mode), [mode]);
   useEffect(() => {
     setMode(get("theme"));