diff --git a/apps/nextjs/src/app/[locale]/_client-providers/trpc.tsx b/apps/nextjs/src/app/[locale]/_client-providers/trpc.tsx
index 90df364f2..6ddcd97e4 100644
--- a/apps/nextjs/src/app/[locale]/_client-providers/trpc.tsx
+++ b/apps/nextjs/src/app/[locale]/_client-providers/trpc.tsx
@@ -21,8 +21,17 @@ import { clientApi } from "@homarr/api/client";
 
 import { env } from "~/env.mjs";
 
+const getWebSocketProtocol = () => {
+  // window is not defined on server side
+  if (typeof window === "undefined") {
+    return "ws";
+  }
+
+  return window.location.protocol === "https:" ? "wss" : "ws";
+};
+
 const constructWebsocketUrl = () => {
-  const fallback = "ws://localhost:3001/websockets";
+  const fallback = `${getWebSocketProtocol()}://localhost:3001/websockets`;
   if (typeof window === "undefined") {
     return fallback;
   }
@@ -31,7 +40,7 @@ const constructWebsocketUrl = () => {
     return fallback;
   }
 
-  return `ws://${window.location.hostname}:${window.location.port}/websockets`;
+  return `${getWebSocketProtocol()}://${window.location.hostname}:${window.location.port}/websockets`;
 };
 
 const wsClient = createWSClient({