diff --git a/apps/client/src/widgets/type_widgets/abstract_code_type_widget.ts b/apps/client/src/widgets/type_widgets/abstract_code_type_widget.ts
index 88e128079..6ec033df5 100644
--- a/apps/client/src/widgets/type_widgets/abstract_code_type_widget.ts
+++ b/apps/client/src/widgets/type_widgets/abstract_code_type_widget.ts
@@ -80,6 +80,7 @@ export default class AbstractCodeTypeWidget extends TypeWidget {
 
     show() {
         this.$widget.show();
+        this.#updateBackgroundColor();
     }
 
     focus() {
@@ -97,6 +98,7 @@ export default class AbstractCodeTypeWidget extends TypeWidget {
                 this.codeEditor.setText("");
             });
         }
+        this.#updateBackgroundColor("unset");
     }
 
     async executeWithCodeEditorEvent({ resolve, ntxId }: EventData<"executeWithCodeEditor">) {
@@ -117,6 +119,7 @@ export default class AbstractCodeTypeWidget extends TypeWidget {
                 if (theme) {
                     await this.codeEditor.setTheme(theme);
                 }
+                this.#updateBackgroundColor();
             }
         }
 
@@ -125,4 +128,9 @@ export default class AbstractCodeTypeWidget extends TypeWidget {
         }
     }
 
+    #updateBackgroundColor(color?: string) {
+        const $editorEl = $(this.codeEditor.dom);
+        this.$widget.closest(".scrolling-container").css("background-color", color ?? $editorEl.css("background-color"));
+    }
+
 }