diff --git a/.changeset/beige-ravens-count.md b/.changeset/beige-ravens-count.md
new file mode 100644
index 0000000000..f7aaa00b48
--- /dev/null
+++ b/.changeset/beige-ravens-count.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-home': patch
+---
+
+Added a New Frontend System App Root Element for the `<VisitListener />` component
diff --git a/.changeset/yellow-streets-kiss.md b/.changeset/yellow-streets-kiss.md
new file mode 100644
index 0000000000..d6c22887c3
--- /dev/null
+++ b/.changeset/yellow-streets-kiss.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-signals': patch
+---
+
+Added a New Frontend System App Root Element for the `<SignalsDisplay />` component
diff --git a/plugins/home/report-alpha.api.md b/plugins/home/report-alpha.api.md
index f36589ea51..98a8cab823 100644
--- a/plugins/home/report-alpha.api.md
+++ b/plugins/home/report-alpha.api.md
@@ -19,6 +19,21 @@ const _default: FrontendPlugin<
   },
   {},
   {
+    'app-root-element:home/visit-listener': ExtensionDefinition<{
+      kind: 'app-root-element';
+      name: 'visit-listener';
+      config: {};
+      configInput: {};
+      output: ConfigurableExtensionDataRef<
+        JSX_2.Element,
+        'core.reactElement',
+        {}
+      >;
+      inputs: {};
+      params: {
+        element: JSX.Element | (() => JSX.Element);
+      };
+    }>;
     'page:home': ExtensionDefinition<{
       config: {
         path: string | undefined;
diff --git a/plugins/home/src/alpha.tsx b/plugins/home/src/alpha.tsx
index fc34c6e806..880b53af40 100644
--- a/plugins/home/src/alpha.tsx
+++ b/plugins/home/src/alpha.tsx
@@ -21,8 +21,10 @@ import {
   PageBlueprint,
   createFrontendPlugin,
   createRouteRef,
+  AppRootElementBlueprint,
 } from '@backstage/frontend-plugin-api';
 import { compatWrapper } from '@backstage/core-compat-api';
+import { VisitListener } from './components/';
 
 const rootRouteRef = createRouteRef();
 
@@ -63,13 +65,20 @@ const homePage = PageBlueprint.makeWithOverrides({
   },
 });
 
+const visitListenerAppRootElement = AppRootElementBlueprint.make({
+  name: 'visit-listener',
+  params: {
+    element: <VisitListener />,
+  },
+});
+
 /**
  * @alpha
  */
 export default createFrontendPlugin({
   pluginId: 'home',
   info: { packageJson: () => import('../package.json') },
-  extensions: [homePage],
+  extensions: [homePage, visitListenerAppRootElement],
   routes: {
     root: rootRouteRef,
   },
diff --git a/plugins/signals/package.json b/plugins/signals/package.json
index 8243dab383..1f5bac86f9 100644
--- a/plugins/signals/package.json
+++ b/plugins/signals/package.json
@@ -51,6 +51,7 @@
     "test": "backstage-cli package test"
   },
   "dependencies": {
+    "@backstage/core-compat-api": "workspace:^",
     "@backstage/core-components": "workspace:^",
     "@backstage/core-plugin-api": "workspace:^",
     "@backstage/frontend-plugin-api": "workspace:^",
diff --git a/plugins/signals/report-alpha.api.md b/plugins/signals/report-alpha.api.md
index 45ee0da3b8..3fc89308c1 100644
--- a/plugins/signals/report-alpha.api.md
+++ b/plugins/signals/report-alpha.api.md
@@ -7,6 +7,7 @@ import { AnyApiFactory } from '@backstage/frontend-plugin-api';
 import { ConfigurableExtensionDataRef } from '@backstage/frontend-plugin-api';
 import { ExtensionDefinition } from '@backstage/frontend-plugin-api';
 import { FrontendPlugin } from '@backstage/frontend-plugin-api';
+import { JSX as JSX_2 } from 'react';
 
 // @alpha (undocumented)
 const _default: FrontendPlugin<
@@ -28,6 +29,21 @@ const _default: FrontendPlugin<
         factory: AnyApiFactory;
       };
     }>;
+    'app-root-element:signals/signals-display': ExtensionDefinition<{
+      kind: 'app-root-element';
+      name: 'signals-display';
+      config: {};
+      configInput: {};
+      output: ConfigurableExtensionDataRef<
+        JSX_2.Element,
+        'core.reactElement',
+        {}
+      >;
+      inputs: {};
+      params: {
+        element: JSX.Element | (() => JSX.Element);
+      };
+    }>;
   }
 >;
 export default _default;
diff --git a/plugins/signals/src/alpha.tsx b/plugins/signals/src/alpha.tsx
index 90b78b05fd..38955473e1 100644
--- a/plugins/signals/src/alpha.tsx
+++ b/plugins/signals/src/alpha.tsx
@@ -16,6 +16,7 @@
 
 import {
   ApiBlueprint,
+  AppRootElementBlueprint,
   createApiFactory,
   createFrontendPlugin,
   discoveryApiRef,
@@ -23,6 +24,8 @@ import {
 } from '@backstage/frontend-plugin-api';
 import { signalApiRef } from '@backstage/plugin-signals-react';
 import { SignalClient } from './api/SignalClient';
+import { SignalsDisplay } from './plugin';
+import { compatWrapper } from '@backstage/core-compat-api';
 
 const api = ApiBlueprint.make({
   params: {
@@ -42,9 +45,16 @@ const api = ApiBlueprint.make({
   },
 });
 
+const signalsDisplayAppRootElement = AppRootElementBlueprint.make({
+  name: 'signals-display',
+  params: {
+    element: compatWrapper(<SignalsDisplay />),
+  },
+});
+
 /** @alpha */
 export default createFrontendPlugin({
   pluginId: 'signals',
   info: { packageJson: () => import('../package.json') },
-  extensions: [api],
+  extensions: [api, signalsDisplayAppRootElement],
 });
diff --git a/yarn.lock b/yarn.lock
index 45962f279b..b244b2539e 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -8633,6 +8633,7 @@ __metadata:
   dependencies:
     "@backstage/cli": "workspace:^"
     "@backstage/core-app-api": "workspace:^"
+    "@backstage/core-compat-api": "workspace:^"
     "@backstage/core-components": "workspace:^"
     "@backstage/core-plugin-api": "workspace:^"
     "@backstage/dev-utils": "workspace:^"