From dbfd55f0ca3c34d1be5c08c0ec5f9be51440119c Mon Sep 17 00:00:00 2001
From: Anthony Shew <anthonyshew@gmail.com>
Date: Mon, 19 Jan 2026 07:03:24 -0700
Subject: [PATCH] fix: Sync favicon to browser theme preference on initial load

---
 docs/site/components/use-color-scheme.tsx | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/docs/site/components/use-color-scheme.tsx b/docs/site/components/use-color-scheme.tsx
index d9c711fe11606..0b6c537bb415a 100644
--- a/docs/site/components/use-color-scheme.tsx
+++ b/docs/site/components/use-color-scheme.tsx
@@ -21,6 +21,9 @@ export function useColorScheme(): ColorScheme {
 
     const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
 
+    // Set initial value on mount (SSR defaults to "light", so we need to sync)
+    setColorScheme(mediaQuery.matches ? "dark" : "light");
+
     const handleChange = (event: MediaQueryListEvent): void => {
       setColorScheme(event.matches ? "dark" : "light");
     };