diff --git a/apps/client/src/stylesheets/theme-next/base.css b/apps/client/src/stylesheets/theme-next/base.css
index e9917b142..9058328c3 100644
--- a/apps/client/src/stylesheets/theme-next/base.css
+++ b/apps/client/src/stylesheets/theme-next/base.css
@@ -110,7 +110,8 @@ body.mobile .dropdown-menu .dropdown-menu {
     border-radius: unset !important;
 }
 
-body.desktop .dropdown-menu::before {
+body.desktop .dropdown-menu::before,
+:root .ck.ck-dropdown__panel::before {
     content: "";
     backdrop-filter: var(--dropdown-backdrop-filter);
     border-radius: var(--dropdown-border-radius);
diff --git a/apps/client/src/stylesheets/theme-next/notes/text.css b/apps/client/src/stylesheets/theme-next/notes/text.css
index 5810627a4..98b82fea6 100644
--- a/apps/client/src/stylesheets/theme-next/notes/text.css
+++ b/apps/client/src/stylesheets/theme-next/notes/text.css
@@ -86,10 +86,37 @@
     border: 1px solid var(--ck-editor-popup-border-color) !important;
     border-radius: var(--dropdown-border-radius) !important;
     background: var(--menu-background-color) !important;
-    backdrop-filter: var(--dropdown-backdrop-filter);
     padding: var(--ck-editor-popup-padding);
 }
 
+/*
+ * Backdrop blur pseudo-element
+ *
+ * Since .ck-balloon-panel already uses the :after and :before pseudo-elements, there is no other
+ * option than using a :before on the children element to apply the backdrop blur.
+ * This pseudoelement will overflow and cover the entire surface of .ck-balloon-panel.
+*/
+
+:root .ck-balloon-panel > .ck-toolbar,
+:root .ck-balloon-panel > .ck-balloon-rotator {
+    position: relative;
+}
+
+:root .ck-balloon-panel > .ck-toolbar::before,
+:root .ck-balloon-panel > .ck-balloon-rotator::before  {
+    --negative-padding: calc(0px - var(--ck-editor-popup-padding)); /* Compensate the parent's padding */
+
+    content: "";
+    position: absolute;
+    top: var(--negative-padding);
+    right: var(--negative-padding);
+    bottom: var(--negative-padding);
+    left: var(--negative-padding);
+    border-radius: var(--dropdown-border-radius);
+    backdrop-filter: var(--dropdown-backdrop-filter);
+    z-index: -1;
+}
+
 :root .ck.ck-dropdown__panel {
     --ck-editor-popup-padding: var(--menu-padding-size);
 }