diff --git a/client/src/Pages/StatusPage/Status/index.tsx b/client/src/Pages/StatusPage/Status/index.tsx
index 9c4001fae..f2ac1a83e 100644
--- a/client/src/Pages/StatusPage/Status/index.tsx
+++ b/client/src/Pages/StatusPage/Status/index.tsx
@@ -2,6 +2,7 @@ import { BasePage, BaseFallback } from "@/Components/design-elements";
 import Typography from "@mui/material/Typography";
 import { Link } from "react-router-dom";
 import Stack from "@mui/material/Stack";
+import Box from "@mui/material/Box";
 
 import { useTheme } from "@mui/material";
 import { useTranslation } from "react-i18next";
@@ -111,17 +112,9 @@ const StatusPageView = () => {
 		);
 	}
 
-	const themeConfig = THEME_CONFIGS[resolveStatusPageTheme(statusPage.theme)];
-	const themedRenderer = (
-		<BaseStatusPage
-			statusPage={statusPage}
-			monitors={monitors}
-			config={themeConfig}
-		/>
-	);
-
 	// Public route: render directly on the viewport, themed background covers everything.
 	if (isPublic) {
+		const themeConfig = THEME_CONFIGS[resolveStatusPageTheme(statusPage.theme)];
 		return (
 			<StatusPageThemeProvider
 				theme={statusPage.theme}
@@ -129,7 +122,11 @@ const StatusPageView = () => {
 				timezone={statusPage.timezone}
 				paintBody
 			>
-				{themedRenderer}
+				<BaseStatusPage
+					statusPage={statusPage}
+					monitors={monitors}
+					config={themeConfig}
+				/>
 			</StatusPageThemeProvider>
 		);
 	}
@@ -153,7 +150,16 @@ const StatusPageView = () => {
 				timezone={statusPage.timezone}
 				transparent
 			>
-				<BrowserFrame url={publicUrl}>{themedRenderer}</BrowserFrame>
+				<BrowserFrame url={publicUrl}>
+					<Box
+						component="iframe"
+						src={publicUrl}
+						title={t("pages.statusPages.preview.title")}
+						flex={1}
+						width="100%"
+						border={0}
+					/>
+				</BrowserFrame>
 			</StatusPageThemeProvider>
 		</BasePage>
 	);
diff --git a/client/src/Pages/StatusPage/Status/themes/BrowserFrame.tsx b/client/src/Pages/StatusPage/Status/themes/BrowserFrame.tsx
index b893aa85c..183e1fdea 100644
--- a/client/src/Pages/StatusPage/Status/themes/BrowserFrame.tsx
+++ b/client/src/Pages/StatusPage/Status/themes/BrowserFrame.tsx
@@ -64,7 +64,13 @@ export const BrowserFrame = ({ url, children }: Props) => {
 					{url}
 				</Box>
 			</Box>
-			<Box sx={{ flex: 1, minHeight: 0 }}>{children}</Box>
+			<Box
+				display="flex"
+				flexDirection="column"
+				sx={{ flex: 1, minHeight: 0 }}
+			>
+				{children}
+			</Box>
 		</Box>
 	);
 };
diff --git a/client/src/locales/en.json b/client/src/locales/en.json
index a142156b2..b2a643f8b 100644
--- a/client/src/locales/en.json
+++ b/client/src/locales/en.json
@@ -1606,6 +1606,9 @@
 			"header": {
 				"title": "Status pages",
 				"description": "Publish public pages that show real-time uptime and incident history to your customers and stakeholders."
+			},
+			"preview": {
+				"title": "Status page preview"
 			}
 		},
 		"uptime": {