diff --git a/frontend/src/components/InfoModal.tsx b/frontend/src/components/InfoModal.tsx
index e9770c0..6f18891 100644
--- a/frontend/src/components/InfoModal.tsx
+++ b/frontend/src/components/InfoModal.tsx
@@ -12,16 +12,23 @@ interface InfoModalProps {
 export function InfoModal({ showModal, setShowModal, title, children }: InfoModalProps) {
   return (
     <Modal showModal={showModal} setShowModal={setShowModal}>
-      <div className="w-full max-h-[80vh] overflow-y-auto bg-white/95 backdrop-blur-xl shadow-xl p-4 md:max-w-3xl md:rounded-2xl md:border md:border-gray-200">
-        <Close
-          className="absolute top-4 right-4 h-6 w-6 text-gray-500 hover:text-gray-700 cursor-pointer"
-          onClick={() => setShowModal(false)}
-          onPointerDown={(e) => e.stopPropagation()}
-        />
-        <div className="flex flex-col items-center justify-center space-y-3 border-b border-gray-200 px-4 py-5 text-center md:px-16">
-          <h3 className="font-display text-2xl font-bold">{title}</h3>
+      {/* 修复：将背景色从白色更改为网站的深色主题，并调整边框颜色 */}
+      <div className="w-full max-h-[80vh] flex flex-col bg-neutral-800/95 backdrop-blur-xl shadow-xl md:max-w-3xl md:rounded-2xl md:border md:border-cyan-50/20">
+        {/* 修复：创建一个固定的头部，包含标题和关闭按钮，使其不随内容滚动 */}
+        <div className="flex-shrink-0 flex items-center justify-center p-4 border-b border-cyan-50/20 relative">
+            <h3 className="font-display text-2xl font-bold text-white">{title}</h3>
+            <Close
+              className="absolute top-4 right-4 h-6 w-6 text-gray-400 hover:text-white cursor-pointer"
+              onClick={() => setShowModal(false)}
+              onPointerDown={(e) => e.stopPropagation()}
+            />
+        </div>
+
+        {/* 修复：为内容区域添加 overflow-y-auto，使其可独立滚动 */}
+        <div className="flex-grow overflow-y-auto text-white p-6">
+            {/* 修复：将内容区域的文字颜色从黑色改为白色 */}
+            <div className="text-white">{children}</div>
         </div>
-        <div className="text-black p-4">{children}</div>
       </div>
     </Modal>
   );
diff --git a/frontend/src/pages/About.tsx b/frontend/src/pages/About.tsx
index bb6bee7..3ff45f4 100644
--- a/frontend/src/pages/About.tsx
+++ b/frontend/src/pages/About.tsx
@@ -1,7 +1,8 @@
 // 这个文件内容直接从您的 _h.about.tsx 迁移而来
 export function About() {
   return (
-    <div className="text-black">
+    // 修复：移除 text-black 类，文本颜色将由父组件 InfoModal 控制
+    <div>
       <div className="max-w-[1400px] ">
         <p className="mt-8">
           <strong>Vmail.DEV </strong> is a Virtual temporary email service.{" "}
diff --git a/frontend/src/pages/Privacy.tsx b/frontend/src/pages/Privacy.tsx
index 5030c45..513635c 100644
--- a/frontend/src/pages/Privacy.tsx
+++ b/frontend/src/pages/Privacy.tsx
@@ -1,7 +1,8 @@
 // 这个文件内容直接从您的 _h.privacy.tsx 迁移而来
 export function Privacy() {
   return (
-    <div className="text-black">
+    // 修复：移除 text-black 类，文本颜色将由父组件 InfoModal 控制
+    <div>
       <div className="max-w-[1400px] ">
         <p className="mt-8">
           At Vmail.DEV, we value the privacy of our users and are committed to
diff --git a/frontend/src/pages/Terms.tsx b/frontend/src/pages/Terms.tsx
index 27ee618..3b5048b 100644
--- a/frontend/src/pages/Terms.tsx
+++ b/frontend/src/pages/Terms.tsx
@@ -1,7 +1,8 @@
 // 这个文件内容直接从您的 _h.terms.tsx 迁移而来
 export function Terms() {
   return (
-    <div className="text-black">
+    // 修复：移除 text-black 类，文本颜色将由父组件 InfoModal 控制
+    <div>
       <div className="max-w-[1400px] ">
         <p className="mt-8">
           Welcome to Vmail.DEV! These Terms of Service ("Terms") govern your