diff --git a/apps/web/components/common/rich-text-editor.css b/apps/web/components/common/rich-text-editor.css
index 599a9555..47c3c416 100644
--- a/apps/web/components/common/rich-text-editor.css
+++ b/apps/web/components/common/rich-text-editor.css
@@ -94,6 +94,7 @@
 
 /* Code blocks */
 .rich-text-editor pre {
+  font-family: var(--font-mono, ui-monospace, monospace);
   background: var(--muted);
   border-radius: var(--radius);
   padding: 0.75rem 1rem;
diff --git a/apps/web/components/markdown/CodeBlock.tsx b/apps/web/components/markdown/CodeBlock.tsx
index 6bdd4d2c..ef69afb4 100644
--- a/apps/web/components/markdown/CodeBlock.tsx
+++ b/apps/web/components/markdown/CodeBlock.tsx
@@ -141,7 +141,7 @@ export function CodeBlock({
   if (mode === 'terminal') {
     return (
       <pre className={cn('font-mono text-sm whitespace-pre-wrap', className)}>
-        <code>{code}</code>
+        <code className="font-mono">{code}</code>
       </pre>
     )
   }
@@ -151,7 +151,7 @@ export function CodeBlock({
     if (isLoading || !highlighted) {
       return (
         <pre className={cn('font-mono text-sm whitespace-pre-wrap', className)}>
-          <code>{code}</code>
+          <code className="font-mono">{code}</code>
         </pre>
       )
     }
@@ -159,7 +159,7 @@ export function CodeBlock({
     return (
       <div
         className={cn(
-          'font-mono text-sm [&_pre]:!bg-transparent [&_pre]:!p-0 [&_pre]:whitespace-pre-wrap [&_pre]:break-all [&_code]:!bg-transparent',
+          'font-mono text-sm [&_pre]:!bg-transparent [&_pre]:!p-0 [&_pre]:whitespace-pre-wrap [&_pre]:break-all [&_code]:!bg-transparent [&_code]:font-mono [&_pre]:font-mono',
           className
         )}
         dangerouslySetInnerHTML={{ __html: highlighted }}
@@ -206,11 +206,11 @@ export function CodeBlock({
       <div className="p-3 overflow-x-auto">
         {isLoading || !highlighted ? (
           <pre className="font-mono text-sm whitespace-pre-wrap break-all">
-            <code>{code}</code>
+            <code className="font-mono">{code}</code>
           </pre>
         ) : (
           <div
-            className="font-mono text-sm [&_pre]:!bg-transparent [&_pre]:!m-0 [&_pre]:!p-0 [&_pre]:whitespace-pre-wrap [&_pre]:break-all [&_code]:!bg-transparent"
+            className="font-mono text-sm [&_pre]:!bg-transparent [&_pre]:!m-0 [&_pre]:!p-0 [&_pre]:whitespace-pre-wrap [&_pre]:break-all [&_code]:!bg-transparent [&_code]:font-mono [&_pre]:font-mono"
             dangerouslySetInnerHTML={{ __html: highlighted }}
           />
         )}