diff --git a/app/assets/javascripts/discourse/app/components/d-modal.gjs b/app/assets/javascripts/discourse/app/components/d-modal.gjs
index e38a0391cca..487828bdd60 100644
--- a/app/assets/javascripts/discourse/app/components/d-modal.gjs
+++ b/app/assets/javascripts/discourse/app/components/d-modal.gjs
@@ -12,6 +12,7 @@ import DButton from "discourse/components/d-button";
 import FlashMessage from "discourse/components/flash-message";
 import concatClass from "discourse/helpers/concat-class";
 import element from "discourse/helpers/element";
+import htmlClass from "discourse/helpers/html-class";
 import {
   disableBodyScroll,
   enableBodyScroll,
@@ -261,6 +262,7 @@ export default class DModal extends Component {
       @inline={{@inline}}
       @append={{true}}
     >
+      {{htmlClass "modal-open"}}
       <this.dynamicElement
         class={{concatClass
           "modal"
diff --git a/app/assets/stylesheets/desktop/modal.scss b/app/assets/stylesheets/desktop/modal.scss
index 491de3e4cdb..77a183df7fe 100644
--- a/app/assets/stylesheets/desktop/modal.scss
+++ b/app/assets/stylesheets/desktop/modal.scss
@@ -1,3 +1,7 @@
+html.modal-open {
+  overflow: hidden;
+}
+
 .d-modal {
   --modal-max-width: 600px;
   --modal-width: 30em; // set in ems to scale with user font-size