diff --git a/apps/client/src/features/editor/components/ai-menu/result-preview.tsx b/apps/client/src/features/editor/components/ai-menu/result-preview.tsx
index 330dfaf0..7388f1b1 100644
--- a/apps/client/src/features/editor/components/ai-menu/result-preview.tsx
+++ b/apps/client/src/features/editor/components/ai-menu/result-preview.tsx
@@ -1,4 +1,5 @@
 import { Loader, Paper, Text } from "@mantine/core";
+import DOMPurify from "dompurify";
 import { marked } from "marked";
 import { memo } from "react";
 import classes from "./ai-menu.module.css";
@@ -13,12 +14,12 @@ const ResultPreview = memo(({ output, isLoading }: ResultPreviewProps) => {
   const parsedOutput = `${marked.parse(output)}`;
 
   return (
-    <Paper p="sm" mb={4} withBorder>
-      <Text size="sm">
+    <Paper p="sm" mb={4} shadow="lg" withBorder>
+      <Text size="sm" component="div">
         {parsedOutput && (
           <div
             className={classes.resultPreviewWrapper}
-            dangerouslySetInnerHTML={{ __html: parsedOutput }}
+            dangerouslySetInnerHTML={{ __html: DOMPurify.sanitize(parsedOutput) }}
           />
         )}
         {isLoading && <Loader size={12} ml="xs" display="inline-block" />}