diff --git a/src/editors/MarkdownEditor.tsx b/src/editors/MarkdownEditor.tsx
index d85b2d0e..7349ef5a 100644
--- a/src/editors/MarkdownEditor.tsx
+++ b/src/editors/MarkdownEditor.tsx
@@ -1,5 +1,6 @@
-import { lazy, Suspense, useMemo, useCallback } from "react";
+import { lazy, Suspense, useMemo, useCallback, useEffect } from "react";
 import useAppStore from "../store/store";
+import { useMonaco } from "@monaco-editor/react";
 
 const MonacoEditor = lazy(() =>
   import("@monaco-editor/react").then((mod) => ({ default: mod.Editor }))
@@ -13,12 +14,36 @@ export default function MarkdownEditor({
   onChange?: (value: string | undefined) => void;
 }) {
   const backgroundColor = useAppStore((state) => state.backgroundColor);
+  const textColor = useAppStore((state) => state.textColor);
+  const monaco = useMonaco();
 
   const themeName = useMemo(
     () => (backgroundColor ? "darkTheme" : "lightTheme"),
     [backgroundColor]
   );
 
+  useEffect(() => {
+    if (monaco) {
+      const defineTheme = (name: string, base: "vs" | "vs-dark") => {
+        monaco.editor.defineTheme(name, {
+          base,
+          inherit: true,
+          rules: [],
+          colors: {
+            "editor.background": backgroundColor,
+            "editor.foreground": textColor,
+            "editor.lineHighlightBorder": "#EDE8DC",
+          },
+        });
+      };
+
+      defineTheme("lightTheme", "vs");
+      defineTheme("darkTheme", "vs-dark");
+
+      monaco.editor.setTheme(themeName);
+    }
+  }, [monaco, backgroundColor, textColor, themeName]);
+
   const editorOptions = {
     minimap: { enabled: false },
     wordWrap: "on" as const,