diff --git a/addons/website/static/src/core/colibri.js b/addons/website/static/src/core/colibri.js
index a4fb9b7138322..9934a56efc8a1 100644
--- a/addons/website/static/src/core/colibri.js
+++ b/addons/website/static/src/core/colibri.js
@@ -78,7 +78,11 @@ export class Colibri {
                 }
             }
         } else {
-            el.setAttribute(attr, value);
+            if (value) {
+                el.setAttribute(attr, value);
+            } else {
+                el.removeAttribute(attr);
+            }
         }
     }
 
diff --git a/addons/website/static/tests/core/interaction.test.js b/addons/website/static/tests/core/interaction.test.js
index 02f9a63dd255d..c33bfe59aee98 100644
--- a/addons/website/static/tests/core/interaction.test.js
+++ b/addons/website/static/tests/core/interaction.test.js
@@ -592,6 +592,23 @@ describe("dynamic attributes", () => {
         );
     });
 
+    test("t-att- can remove an attribute with undefined", async () => {
+        class Test extends Interaction {
+            static selector = "span";
+            dynamicContent = {
+                "_root:t-att-a": () => undefined,
+            };
+        }
+
+        const { el } = await startInteraction(
+            Test,
+            `<span a="b">coucou</span>`,
+        );
+        expect(el.querySelector("span").outerHTML).toBe(
+            `<span>coucou</span>`,
+        );
+    });
+
     test("t-att-class can add multiple classes", async () => {
         class Test extends Interaction {
             static selector = "span";