diff --git a/src/components/mdx-preview.tsx b/src/components/mdx-preview.tsx
index 2fdec45..faabd6b 100644
--- a/src/components/mdx-preview.tsx
+++ b/src/components/mdx-preview.tsx
@@ -56,7 +56,7 @@ export default function MdxPreview({ source }: MdxPreviewProps) {
             [
               rehypePretty,
               {
-                theme: currentTheme.id,
+                theme: currentTheme,
                 keepBackground: false,
               },
             ],
diff --git a/src/hooks/use-monaco-theme.ts b/src/hooks/use-monaco-theme.ts
index 043ef74..3f2d113 100644
--- a/src/hooks/use-monaco-theme.ts
+++ b/src/hooks/use-monaco-theme.ts
@@ -5,7 +5,7 @@ import { MonacoThemeConfig } from "@/config/monaco-theme";
 export function useMonacoTheme() {
   const { resolvedTheme } = useTheme();
 
-  const currentTheme = resolvedTheme === "light" ? MonacoThemeConfig[MonacoTheme.GitHubLightDefault] : MonacoThemeConfig[MonacoTheme.GitHubDarkDefault];
+  const currentTheme = resolvedTheme === "light" ? MonacoThemeConfig[MonacoTheme.GitHubLightDefault].id : MonacoThemeConfig[MonacoTheme.GitHubDarkDefault].id;
 
   return {
     currentTheme,