diff --git a/web/src/pages/flow/list/agent-template-modal.tsx b/web/src/pages/flow/list/agent-template-modal.tsx
index 6dfa33e62..5a90d16c7 100644
--- a/web/src/pages/flow/list/agent-template-modal.tsx
+++ b/web/src/pages/flow/list/agent-template-modal.tsx
@@ -7,6 +7,7 @@ import { useCallback, useState } from 'react';
 import CreateAgentModal from './create-agent-modal';
 import GraphAvatar from './graph-avatar';
 
+import DOMPurify from 'dompurify';
 import styles from './index.less';
 
 const { Title, Text, Paragraph } = Typography;
@@ -83,7 +84,11 @@ const AgentTemplateModal = ({ visible, hideModal, loading, onOk }: IProps) => {
                 </Flex>
                 <div className={styles.agentDescription}>
                   <Paragraph ellipsis={{ tooltip: x.description, rows: 5 }}>
-                    {x.description}
+                    <div
+                      dangerouslySetInnerHTML={{
+                        __html: DOMPurify.sanitize(x.description),
+                      }}
+                    ></div>
                   </Paragraph>
                 </div>
                 {selectedId === x.id && (