diff --git a/website/pages/_app.tsx b/website/pages/_app.tsx
index 56a03299..99163093 100755
--- a/website/pages/_app.tsx
+++ b/website/pages/_app.tsx
@@ -17,7 +17,9 @@ import Footer from "components/Footer";
 import NextNProgress from "nextjs-progressbar";
 
 const customTheme = extendTheme(
-  {
+  { 
+    initialColorMode: 'system',
+    useSystemColorMode: true,
     styles: {
       global: (props: any) => ({
         body: {