diff --git a/web/.env.devnet.public b/web/.env.devnet.public
index acfd07542..1e24ba5bb 100644
--- a/web/.env.devnet.public
+++ b/web/.env.devnet.public
@@ -2,3 +2,4 @@
 export REACT_APP_DEPLOYMENT=devnet
 export REACT_APP_KLEROS_CORE_SUBGRAPH_DEVNET=https://api.thegraph.com/subgraphs/name/kleros/kleros-v2-core-devnet
 export REACT_APP_DISPUTE_TEMPLATE_ARBGOERLI_SUBGRAPH_DEVNET=https://api.thegraph.com/subgraphs/name/kleros/kleros-v2-dr-devnet
+export REACT_APP_STATUS_URL=https://kleros-v2-devnet.betteruptime.com/badge
\ No newline at end of file
diff --git a/web/.env.testnet.public b/web/.env.testnet.public
index 813f673d9..a88ef5904 100644
--- a/web/.env.testnet.public
+++ b/web/.env.testnet.public
@@ -2,3 +2,4 @@
 export REACT_APP_DEPLOYMENT=testnet
 export REACT_APP_KLEROS_CORE_SUBGRAPH_TESTNET=https://api.thegraph.com/subgraphs/name/kleros/kleros-v2-core-testnet-2
 export REACT_APP_DISPUTE_TEMPLATE_ARBGOERLI_SUBGRAPH_TESTNET=https://api.thegraph.com/subgraphs/name/kleros/kleros-v2-dr-testnet-2
+export REACT_APP_STATUS_URL=https://kleros-v2.betteruptime.com/badge
\ No newline at end of file
diff --git a/web/src/layout/Header/navbar/Debug.tsx b/web/src/layout/Header/navbar/Debug.tsx
index a8333db56..7c1f0ec87 100644
--- a/web/src/layout/Header/navbar/Debug.tsx
+++ b/web/src/layout/Header/navbar/Debug.tsx
@@ -1,9 +1,14 @@
-import React from "react";
+import React, { useMemo } from "react";
 import styled from "styled-components";
 import { useSortitionModulePhase } from "hooks/contracts/generated";
+import { useToggleTheme } from "hooks/useToggleThemeContext";
 import { GIT_BRANCH, GIT_DIRTY, GIT_HASH, GIT_TAGS, GIT_URL, RELEASE_VERSION } from "consts/index";
 
 const Container = styled.div`
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+
   label,
   a {
     font-family: "Roboto Mono", monospace;
@@ -13,6 +18,13 @@ const Container = styled.div`
   }
 `;
 
+const StyledIframe = styled.iframe`
+  border: none;
+  width: 100%;
+  height: 30px;
+  border-radius: 300px;
+`;
+
 const Version = () => (
   <label>
     v{RELEASE_VERSION}{" "}
@@ -25,6 +37,13 @@ const Version = () => (
   </label>
 );
 
+const ServicesStatus = () => {
+  const [theme] = useToggleTheme();
+  const statusUrlParameters = useMemo(() => (theme === "light" ? "?theme=light" : "?theme=dark"), [theme]);
+  const statusUrl = process.env.REACT_APP_STATUS_URL;
+  return <label>{statusUrl && <StyledIframe src={`${statusUrl + statusUrlParameters}`} />}</label>;
+};
+
 enum Phases {
   staking,
   generating,
@@ -35,21 +54,13 @@ const Phase = () => {
   const { data: phase } = useSortitionModulePhase({
     watch: true,
   });
-  return (
-    <>
-      {phase !== undefined && (
-        <label>
-          <br />
-          phase: {Phases[phase]}
-        </label>
-      )}
-    </>
-  );
+  return <>{phase !== undefined && <label>Phase: {Phases[phase]}</label>}</>;
 };
 
 const Debug: React.FC = () => {
   return (
     <Container>
+      <ServicesStatus />
       <Version />
       <Phase />
     </Container>