diff --git a/packages/embeds/embed-core/index.html b/packages/embeds/embed-core/index.html
index 03b560959d..cd7e1396ff 100644
--- a/packages/embeds/embed-core/index.html
+++ b/packages/embeds/embed-core/index.html
@@ -161,6 +161,8 @@
         <h3>
           <a href="?only=ns:default">[Dark Theme][Guests(janedoe@example.com and test@example.com)]</a>
         </h3>
+        <button onclick="Cal('ui',{theme:'light'})" >Toggle to Light</button>
+
         <i class="last-action"> You would see last Booking page action in my place </i>
         <div>
           <div class="place" style="width: 100%"></div>
diff --git a/packages/lib/hooks/useTheme.tsx b/packages/lib/hooks/useTheme.tsx
index fc7f66d808..8dab7f1c16 100644
--- a/packages/lib/hooks/useTheme.tsx
+++ b/packages/lib/hooks/useTheme.tsx
@@ -22,10 +22,8 @@ export default function useTheme(themeToSet?: Maybe<string>) {
 
     if (!finalThemeToSet || finalThemeToSet === activeTheme) return;
 
-    console.log("Setting theme", { resolvedTheme, finalThemeToSet, activeTheme, forcedTheme });
     setTheme(finalThemeToSet);
-    // eslint-disable-next-line react-hooks/exhaustive-deps -- we do not want activeTheme to re-render this effect
-  }, [themeToSet, setTheme]);
+  }, [themeToSet, setTheme, embedTheme, activeTheme]);
 
   return {
     resolvedTheme,