diff --git a/src/components/code-editor.tsx b/src/components/code-editor.tsx
index 555f80a..631c5e1 100644
--- a/src/components/code-editor.tsx
+++ b/src/components/code-editor.tsx
@@ -53,7 +53,7 @@ export default function CodeEditor({
     setPath,
     setValue,
   } = useCodeEditorStore();
-  const { monacoTheme } = useMonacoTheme();
+  const { currentTheme } = useMonacoTheme();
   const editorRef = useRef<editor.IStandaloneCodeEditor | null>(null);
   const monacoLanguageClientRef = useRef<MonacoLanguageClient | null>(null);
 
@@ -149,7 +149,7 @@ export default function CodeEditor({
   return (
     <Editor
       language={language}
-      theme={monacoTheme.id}
+      theme={currentTheme.id}
       path={path}
       value={value}
       beforeMount={handleEditorWillMount}
diff --git a/src/components/mdx-preview.tsx b/src/components/mdx-preview.tsx
index 9a29c47..2fdec45 100644
--- a/src/components/mdx-preview.tsx
+++ b/src/components/mdx-preview.tsx
@@ -22,7 +22,7 @@ interface MdxPreviewProps {
 }
 
 export default function MdxPreview({ source }: MdxPreviewProps) {
-  const { monacoTheme } = useMonacoTheme();
+  const { currentTheme } = useMonacoTheme();
   const [error, setError] = useState<string | null>(null);
   const [isLoading, setIsLoading] = useState<boolean>(true);
   const [mdxSource, setMdxSource] = useState<MDXRemoteSerializeResult | null>(null);
@@ -56,7 +56,7 @@ export default function MdxPreview({ source }: MdxPreviewProps) {
             [
               rehypePretty,
               {
-                theme: monacoTheme.id,
+                theme: currentTheme.id,
                 keepBackground: false,
               },
             ],
@@ -72,7 +72,7 @@ export default function MdxPreview({ source }: MdxPreviewProps) {
     } finally {
       setIsLoading(false);
     }
-  }, [source, monacoTheme]);
+  }, [source, currentTheme]);
 
   // Delay the serialize process to the next event loop to avoid flickering
   // when copying code to the editor and the MDX preview shrinks.
diff --git a/src/hooks/use-monaco-theme.ts b/src/hooks/use-monaco-theme.ts
index 847f85a..043ef74 100644
--- a/src/hooks/use-monaco-theme.ts
+++ b/src/hooks/use-monaco-theme.ts
@@ -5,9 +5,9 @@ import { MonacoThemeConfig } from "@/config/monaco-theme";
 export function useMonacoTheme() {
   const { resolvedTheme } = useTheme();
 
-  const monacoTheme = resolvedTheme === "light" ? MonacoThemeConfig[MonacoTheme.GitHubLightDefault] : MonacoThemeConfig[MonacoTheme.GitHubDarkDefault];
+  const currentTheme = resolvedTheme === "light" ? MonacoThemeConfig[MonacoTheme.GitHubLightDefault] : MonacoThemeConfig[MonacoTheme.GitHubDarkDefault];
 
   return {
-    monacoTheme,
+    currentTheme,
   };
 }