diff --git a/src/components/editor/theme-control-panel.tsx b/src/components/editor/theme-control-panel.tsx
index 4693eab5..dd8ce89a 100644
--- a/src/components/editor/theme-control-panel.tsx
+++ b/src/components/editor/theme-control-panel.tsx
@@ -21,6 +21,7 @@ import {
   DEFAULT_FONT_SANS,
   DEFAULT_FONT_SERIF,
   COMMON_STYLES,
+  defaultThemeState,
 } from "../../config/theme";
 import { Separator } from "../ui/separator";
 import { AlertCircle } from "lucide-react";
@@ -45,7 +46,10 @@ const ThemeControlPanel = ({
   } = useEditorStore();
   const [cssImportOpen, setCssImportOpen] = useState(false);
 
-  const currentStyles = styles?.[currentMode];
+  const currentStyles = {
+    ...defaultThemeState.styles[currentMode],
+    ...styles?.[currentMode],
+  };
 
   const updateStyle = React.useCallback(
     <K extends keyof typeof currentStyles>(