diff --git a/addons/web_tour/static/src/tour_service/tour_pointer_container.js b/addons/web_tour/static/src/tour_service/tour_pointer_container.js
deleted file mode 100644
index 58be7eb4333..00000000000
--- a/addons/web_tour/static/src/tour_service/tour_pointer_container.js
+++ /dev/null
@@ -1,11 +0,0 @@
-/** @odoo-module **/
-
-import { Component, xml } from "@odoo/owl";
-
-export class TourPointerContainer extends Component {}
-TourPointerContainer.props = { pointers: Object };
-TourPointerContainer.template = xml`
-    <t t-foreach="Object.values(props.pointers)" t-as="pointer" t-key="pointer.id">
-        <t t-component="pointer.component" t-props="pointer.props"/>
-    </t>
-`;
diff --git a/addons/web_tour/static/src/tour_service/tour_service.js b/addons/web_tour/static/src/tour_service/tour_service.js
index 23d7a3e791a..6380af3fae7 100644
--- a/addons/web_tour/static/src/tour_service/tour_service.js
+++ b/addons/web_tour/static/src/tour_service/tour_service.js
@@ -8,7 +8,6 @@ import { registry } from "@web/core/registry";
 import { config as transitionConfig } from "@web/core/transition";
 import { session } from "@web/session";
 import { TourPointer } from "../tour_pointer/tour_pointer";
-import { TourPointerContainer } from "./tour_pointer_container";
 import { compileStepAuto, compileStepManual, compileTourToMacro } from "./tour_compilers";
 import { createPointerState } from "./tour_pointer_state";
 import { tourState } from "./tour_state";
@@ -56,8 +55,8 @@ import { callWithUnloadCheck } from "./tour_utils";
 
 export const tourService = {
     // localization dependency to make sure translations used by tours are loaded
-    dependencies: ["orm", "effect", "ui", "localization"],
-    start: async (_env, { orm, effect, ui }) => {
+    dependencies: ["orm", "effect", "ui", "overlay", "localization"],
+    start: async (_env, { orm, effect, ui, overlay }) => {
         await whenReady();
 
         /** @type {{ [k: string]: Tour }} */
@@ -108,13 +107,9 @@ export const tourService = {
 
         const pointers = reactive({});
 
-        registry.category("main_components").add("TourPointerContainer", {
-            Component: TourPointerContainer,
-            props: { pointers },
-        });
-
         function createPointer(tourName, config) {
             const { state: pointerState, methods } = createPointerState();
+            let remove;
             return {
                 start() {
                     pointers[tourName] = {
@@ -122,8 +117,10 @@ export const tourService = {
                         component: TourPointer,
                         props: { pointerState, ...config },
                     };
+                    remove = overlay.add(pointers[tourName].component, pointers[tourName].props);
                 },
                 stop() {
+                    remove?.();
                     delete pointers[tourName];
                     methods.destroy();
                 },
diff --git a/addons/web_tour/static/tests/tour_service_tests.js b/addons/web_tour/static/tests/tour_service_tests.js
index e58b2aa5651..4f4fb1eb8c5 100644
--- a/addons/web_tour/static/tests/tour_service_tests.js
+++ b/addons/web_tour/static/tests/tour_service_tests.js
@@ -112,21 +112,21 @@ QUnit.module("Tour service", (hooks) => {
         });
         const env = await makeTestEnv({});
 
-        const { Component: TourPointerContainer, props: tourPointerProps } = registry
+        const { Component: OverlayContainer, props: overlayContainerProps } = registry
             .category("main_components")
-            .get("TourPointerContainer");
+            .get("OverlayContainer");
 
         class Root extends Component {
-            static components = { TourPointerContainer, Counter };
+            static components = { OverlayContainer, Counter };
             static template = xml/*html*/ `
                 <t>
                     <Counter />
-                    <TourPointerContainer t-props="props.tourPointerProps" />
+                    <OverlayContainer t-props="props.overlayContainerProps" />
                 </t>
             `;
         }
 
-        await mount(Root, target, { env, props: { tourPointerProps } });
+        await mount(Root, target, { env, props: { overlayContainerProps } });
         env.services.tour_service.startTour("tour1", { mode: "manual" });
         await mock.advanceTime(800);
         assert.containsOnce(document.body, ".o_tour_pointer");
@@ -149,21 +149,21 @@ QUnit.module("Tour service", (hooks) => {
         });
         const env = await makeTestEnv({});
 
-        const { Component: TourPointerContainer, props: tourPointerProps } = registry
+        const { Component: OverlayContainer, props: overlayContainerProps } = registry
             .category("main_components")
-            .get("TourPointerContainer");
+            .get("OverlayContainer");
 
         class Root extends Component {
-            static components = { TourPointerContainer, Counter };
+            static components = { OverlayContainer, Counter };
             static template = xml/*html*/ `
                 <t>
                     <Counter />
-                    <TourPointerContainer t-props="props.tourPointerProps" />
+                    <OverlayContainer t-props="props.overlayContainerProps" />
                 </t>
             `;
         }
 
-        await mount(Root, target, { env, props: { tourPointerProps } });
+        await mount(Root, target, { env, props: { overlayContainerProps } });
         env.services.tour_service.startTour("tour1", { mode: "manual" });
         await mock.advanceTime(750);
         assert.containsOnce(document.body, ".o_tour_pointer");
@@ -182,21 +182,21 @@ QUnit.module("Tour service", (hooks) => {
         });
         const env = await makeTestEnv({});
 
-        const { Component: TourPointerContainer, props: tourPointerProps } = registry
+        const { Component: OverlayContainer, props: overlayContainerProps } = registry
             .category("main_components")
-            .get("TourPointerContainer");
+            .get("OverlayContainer");
 
         class Root extends Component {
-            static components = { TourPointerContainer, Counter };
+            static components = { OverlayContainer, Counter };
             static template = xml/*html*/ `
                 <t>
                     <Counter />
-                    <TourPointerContainer t-props="props.tourPointerProps" />
+                    <OverlayContainer t-props="props.overlayContainerProps" />
                 </t>
             `;
         }
 
-        await mount(Root, target, { env, props: { tourPointerProps } });
+        await mount(Root, target, { env, props: { overlayContainerProps } });
         env.services.tour_service.startTour("tour1", { mode: "manual" });
         env.services.tour_service.bus.addEventListener("STEP-CONSUMMED", ({ detail }) => {
             assert.step(`Tour ${detail.tour.name}, step ${detail.step.trigger}`);
@@ -226,21 +226,21 @@ QUnit.module("Tour service", (hooks) => {
         });
         const env = await makeTestEnv({});
 
-        const { Component: TourPointerContainer, props: tourPointerProps } = registry
+        const { Component: OverlayContainer, props: overlayContainerProps } = registry
             .category("main_components")
-            .get("TourPointerContainer");
+            .get("OverlayContainer");
 
         class Root extends Component {
-            static components = { TourPointerContainer, Counter };
+            static components = { OverlayContainer, Counter };
             static template = xml/*html*/ `
                 <t>
                     <Counter />
-                    <TourPointerContainer t-props="props.tourPointerProps" />
+                    <OverlayContainer t-props="props.overlayContainerProps" />
                 </t>
             `;
         }
 
-        await mount(Root, target, { env, props: { tourPointerProps } });
+        await mount(Root, target, { env, props: { overlayContainerProps } });
         env.services.tour_service.startTour("tour1", { mode: "manual" });
         env.services.tour_service.startTour("tour2", { mode: "manual" });
         await mock.advanceTime(750);
@@ -263,21 +263,21 @@ QUnit.module("Tour service", (hooks) => {
         });
         const env = await makeTestEnv({});
 
-        const { Component: TourPointerContainer, props: tourPointerProps } = registry
+        const { Component: OverlayContainer, props: overlayContainerProps } = registry
             .category("main_components")
-            .get("TourPointerContainer");
+            .get("OverlayContainer");
 
         class Root extends Component {
-            static components = { TourPointerContainer, Counter };
+            static components = { OverlayContainer, Counter };
             static template = xml/*html*/ `
                 <t>
                     <Counter />
-                    <TourPointerContainer t-props="props.tourPointerProps" />
+                    <OverlayContainer t-props="props.overlayContainerProps" />
                 </t>
             `;
         }
 
-        await mount(Root, target, { env, props: { tourPointerProps } });
+        await mount(Root, target, { env, props: { overlayContainerProps } });
         env.services.tour_service.startTour("tour1", { mode: "manual" });
         await mock.advanceTime(750);
         assert.containsOnce(target, ".o_tour_pointer");