diff --git a/ui/providers/dark-mode-provider.tsx b/ui/providers/dark-mode-provider.tsx
index a9c1429..830fc51 100644
--- a/ui/providers/dark-mode-provider.tsx
+++ b/ui/providers/dark-mode-provider.tsx
@@ -14,6 +14,12 @@ export const DarkModeProvider = ({
 }) => {
   const [isDark, setIsDark] = React.useState(true);
 
+  // Set dark theme according to system preference
+  React.useEffect(() => {
+    if (window.matchMedia("(prefers-color-scheme: light)").matches)
+      setIsDark(false);
+  }, []);
+
   return (
     <DarkModeContext.Provider
       value={{ isDark, toggleDark: () => setIsDark((d) => !d) }}