diff --git a/app/apple-icon.svg b/app/apple-icon.svg
new file mode 100644
index 0000000..6f245dd
--- /dev/null
+++ b/app/apple-icon.svg
@@ -0,0 +1,14 @@
+<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
+  <rect width="100" height="100" rx="16" fill="#268a52"/>
+  <g transform="translate(50,50)">
+    <ellipse cx="0" cy="-22" rx="6.5" ry="13" fill="#fff" opacity="0.85"/>
+    <ellipse cx="0" cy="-22" rx="6.5" ry="13" fill="#fff" opacity="0.85" transform="rotate(45)"/>
+    <ellipse cx="0" cy="-22" rx="6.5" ry="13" fill="#fff" opacity="0.85" transform="rotate(90)"/>
+    <ellipse cx="0" cy="-22" rx="6.5" ry="13" fill="#fff" opacity="0.85" transform="rotate(135)"/>
+    <ellipse cx="0" cy="-22" rx="6.5" ry="13" fill="#fff" opacity="0.85" transform="rotate(180)"/>
+    <ellipse cx="0" cy="-22" rx="6.5" ry="13" fill="#fff" opacity="0.85" transform="rotate(225)"/>
+    <ellipse cx="0" cy="-22" rx="6.5" ry="13" fill="#fff" opacity="0.85" transform="rotate(270)"/>
+    <ellipse cx="0" cy="-22" rx="6.5" ry="13" fill="#fff" opacity="0.85" transform="rotate(315)"/>
+    <circle cx="0" cy="0" r="8" fill="#268a52" stroke="#fff" stroke-width="2"/>
+  </g>
+</svg>
diff --git a/app/favicon.ico b/app/favicon.ico
deleted file mode 100644
index 718d6fe..0000000
Binary files a/app/favicon.ico and /dev/null differ
diff --git a/app/globals.css b/app/globals.css
index e67a0e1..9de9461 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -6,8 +6,8 @@
   --surface: #f5f5f5;
   --surface-hover: #e8e8e8;
   --border: #e0e0e0;
-  --accent: #3ea6ff;
-  --accent-hover: #1a91f0;
+  --accent: #268a52;
+  --accent-hover: #1f7044;
   --muted: #888888;
   --card: #fafafa;
 }
diff --git a/app/icon.svg b/app/icon.svg
new file mode 100644
index 0000000..e4fd71b
--- /dev/null
+++ b/app/icon.svg
@@ -0,0 +1,13 @@
+<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
+  <g transform="translate(50,50)">
+    <ellipse cx="0" cy="-28" rx="8" ry="16" fill="#fff" opacity="0.85"/>
+    <ellipse cx="0" cy="-28" rx="8" ry="16" fill="#fff" opacity="0.85" transform="rotate(45)"/>
+    <ellipse cx="0" cy="-28" rx="8" ry="16" fill="#fff" opacity="0.85" transform="rotate(90)"/>
+    <ellipse cx="0" cy="-28" rx="8" ry="16" fill="#fff" opacity="0.85" transform="rotate(135)"/>
+    <ellipse cx="0" cy="-28" rx="8" ry="16" fill="#fff" opacity="0.85" transform="rotate(180)"/>
+    <ellipse cx="0" cy="-28" rx="8" ry="16" fill="#fff" opacity="0.85" transform="rotate(225)"/>
+    <ellipse cx="0" cy="-28" rx="8" ry="16" fill="#fff" opacity="0.85" transform="rotate(270)"/>
+    <ellipse cx="0" cy="-28" rx="8" ry="16" fill="#fff" opacity="0.85" transform="rotate(315)"/>
+    <circle cx="0" cy="0" r="10" fill="#268a52" stroke="#fff" stroke-width="2.5"/>
+  </g>
+</svg>
diff --git a/components/Header.tsx b/components/Header.tsx
index 4af57de..caa471a 100644
--- a/components/Header.tsx
+++ b/components/Header.tsx
@@ -22,17 +22,11 @@ export function Header() {
       {/* Top row: logo + search */}
       <div className="max-w-6xl mx-auto px-4 h-14 flex items-center gap-3">
         <Link href="/" className="flex items-center gap-2.5 shrink-0">
-          <div className="w-8 h-8 rounded-lg bg-accent flex items-center justify-center">
-            <svg
-              viewBox="0 0 24 24"
-              fill="none"
-              className="w-5 h-5 text-white"
-              stroke="currentColor"
-              strokeWidth={2.5}
-            >
-              <path d="M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H20v20H6.5a2.5 2.5 0 0 1 0-5H20" />
-            </svg>
-          </div>
+          <img
+            src="/logo.svg"
+            alt="SunnyMH"
+            className="w-8 h-8 rounded-lg"
+          />
           <span className="text-lg font-extrabold tracking-tight">
             SunnyMH
           </span>
diff --git a/logo/qingtian_appicon.svg b/logo/qingtian_appicon.svg
new file mode 100644
index 0000000..6f245dd
--- /dev/null
+++ b/logo/qingtian_appicon.svg
@@ -0,0 +1,14 @@
+<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
+  <rect width="100" height="100" rx="16" fill="#268a52"/>
+  <g transform="translate(50,50)">
+    <ellipse cx="0" cy="-22" rx="6.5" ry="13" fill="#fff" opacity="0.85"/>
+    <ellipse cx="0" cy="-22" rx="6.5" ry="13" fill="#fff" opacity="0.85" transform="rotate(45)"/>
+    <ellipse cx="0" cy="-22" rx="6.5" ry="13" fill="#fff" opacity="0.85" transform="rotate(90)"/>
+    <ellipse cx="0" cy="-22" rx="6.5" ry="13" fill="#fff" opacity="0.85" transform="rotate(135)"/>
+    <ellipse cx="0" cy="-22" rx="6.5" ry="13" fill="#fff" opacity="0.85" transform="rotate(180)"/>
+    <ellipse cx="0" cy="-22" rx="6.5" ry="13" fill="#fff" opacity="0.85" transform="rotate(225)"/>
+    <ellipse cx="0" cy="-22" rx="6.5" ry="13" fill="#fff" opacity="0.85" transform="rotate(270)"/>
+    <ellipse cx="0" cy="-22" rx="6.5" ry="13" fill="#fff" opacity="0.85" transform="rotate(315)"/>
+    <circle cx="0" cy="0" r="8" fill="#268a52" stroke="#fff" stroke-width="2"/>
+  </g>
+</svg>
diff --git a/logo/qingtian_brand.svg b/logo/qingtian_brand.svg
new file mode 100644
index 0000000..b989a9b
--- /dev/null
+++ b/logo/qingtian_brand.svg
@@ -0,0 +1,18 @@
+<svg viewBox="0 0 420 100" xmlns="http://www.w3.org/2000/svg">
+  <rect width="420" height="100" rx="10" fill="#268a52"/>
+  <!-- Sunflower icon -->
+  <g transform="translate(55,42)">
+    <ellipse cx="0" cy="-20" rx="6" ry="12" fill="#fff" opacity="0.85"/>
+    <ellipse cx="0" cy="-20" rx="6" ry="12" fill="#fff" opacity="0.85" transform="rotate(45)"/>
+    <ellipse cx="0" cy="-20" rx="6" ry="12" fill="#fff" opacity="0.85" transform="rotate(90)"/>
+    <ellipse cx="0" cy="-20" rx="6" ry="12" fill="#fff" opacity="0.85" transform="rotate(135)"/>
+    <ellipse cx="0" cy="-20" rx="6" ry="12" fill="#fff" opacity="0.85" transform="rotate(180)"/>
+    <ellipse cx="0" cy="-20" rx="6" ry="12" fill="#fff" opacity="0.85" transform="rotate(225)"/>
+    <ellipse cx="0" cy="-20" rx="6" ry="12" fill="#fff" opacity="0.85" transform="rotate(270)"/>
+    <ellipse cx="0" cy="-20" rx="6" ry="12" fill="#fff" opacity="0.85" transform="rotate(315)"/>
+    <circle cx="0" cy="0" r="7" fill="#268a52" stroke="#fff" stroke-width="2"/>
+  </g>
+  <!-- Brand text -->
+  <text x="110" y="42" font-family="-apple-system, 'Noto Sans SC', 'PingFang SC', sans-serif" font-size="28" font-weight="500" fill="#fff" letter-spacing="4px">晴天漫画</text>
+  <text x="110" y="64" font-family="-apple-system, 'Helvetica Neue', sans-serif" font-size="11" fill="#fff" opacity="0.5" letter-spacing="1.5px" font-style="italic">Sunny MH</text>
+</svg>
diff --git a/logo/qingtian_favicon.svg b/logo/qingtian_favicon.svg
new file mode 100644
index 0000000..e4fd71b
--- /dev/null
+++ b/logo/qingtian_favicon.svg
@@ -0,0 +1,13 @@
+<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
+  <g transform="translate(50,50)">
+    <ellipse cx="0" cy="-28" rx="8" ry="16" fill="#fff" opacity="0.85"/>
+    <ellipse cx="0" cy="-28" rx="8" ry="16" fill="#fff" opacity="0.85" transform="rotate(45)"/>
+    <ellipse cx="0" cy="-28" rx="8" ry="16" fill="#fff" opacity="0.85" transform="rotate(90)"/>
+    <ellipse cx="0" cy="-28" rx="8" ry="16" fill="#fff" opacity="0.85" transform="rotate(135)"/>
+    <ellipse cx="0" cy="-28" rx="8" ry="16" fill="#fff" opacity="0.85" transform="rotate(180)"/>
+    <ellipse cx="0" cy="-28" rx="8" ry="16" fill="#fff" opacity="0.85" transform="rotate(225)"/>
+    <ellipse cx="0" cy="-28" rx="8" ry="16" fill="#fff" opacity="0.85" transform="rotate(270)"/>
+    <ellipse cx="0" cy="-28" rx="8" ry="16" fill="#fff" opacity="0.85" transform="rotate(315)"/>
+    <circle cx="0" cy="0" r="10" fill="#268a52" stroke="#fff" stroke-width="2.5"/>
+  </g>
+</svg>
diff --git a/logo/qingtian_square.svg b/logo/qingtian_square.svg
new file mode 100644
index 0000000..1347e68
--- /dev/null
+++ b/logo/qingtian_square.svg
@@ -0,0 +1,16 @@
+<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
+  <rect width="200" height="200" rx="16" fill="#268a52"/>
+  <g transform="translate(100,80)">
+    <ellipse cx="0" cy="-28" rx="8" ry="16" fill="#fff" opacity="0.85"/>
+    <ellipse cx="0" cy="-28" rx="8" ry="16" fill="#fff" opacity="0.85" transform="rotate(45)"/>
+    <ellipse cx="0" cy="-28" rx="8" ry="16" fill="#fff" opacity="0.85" transform="rotate(90)"/>
+    <ellipse cx="0" cy="-28" rx="8" ry="16" fill="#fff" opacity="0.85" transform="rotate(135)"/>
+    <ellipse cx="0" cy="-28" rx="8" ry="16" fill="#fff" opacity="0.85" transform="rotate(180)"/>
+    <ellipse cx="0" cy="-28" rx="8" ry="16" fill="#fff" opacity="0.85" transform="rotate(225)"/>
+    <ellipse cx="0" cy="-28" rx="8" ry="16" fill="#fff" opacity="0.85" transform="rotate(270)"/>
+    <ellipse cx="0" cy="-28" rx="8" ry="16" fill="#fff" opacity="0.85" transform="rotate(315)"/>
+    <circle cx="0" cy="0" r="10" fill="#268a52" stroke="#fff" stroke-width="2.5"/>
+  </g>
+  <text x="100" y="145" text-anchor="middle" font-family="-apple-system, 'Noto Sans SC', 'PingFang SC', sans-serif" font-size="22" font-weight="500" fill="#fff" letter-spacing="6px">晴天漫画</text>
+  <text x="100" y="168" text-anchor="middle" font-family="-apple-system, 'Helvetica Neue', sans-serif" font-size="10" fill="#fff" opacity="0.5" letter-spacing="1.5px" font-style="italic">Sunny MH</text>
+</svg>
diff --git a/public/logo.svg b/public/logo.svg
new file mode 100644
index 0000000..6f245dd
--- /dev/null
+++ b/public/logo.svg
@@ -0,0 +1,14 @@
+<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
+  <rect width="100" height="100" rx="16" fill="#268a52"/>
+  <g transform="translate(50,50)">
+    <ellipse cx="0" cy="-22" rx="6.5" ry="13" fill="#fff" opacity="0.85"/>
+    <ellipse cx="0" cy="-22" rx="6.5" ry="13" fill="#fff" opacity="0.85" transform="rotate(45)"/>
+    <ellipse cx="0" cy="-22" rx="6.5" ry="13" fill="#fff" opacity="0.85" transform="rotate(90)"/>
+    <ellipse cx="0" cy="-22" rx="6.5" ry="13" fill="#fff" opacity="0.85" transform="rotate(135)"/>
+    <ellipse cx="0" cy="-22" rx="6.5" ry="13" fill="#fff" opacity="0.85" transform="rotate(180)"/>
+    <ellipse cx="0" cy="-22" rx="6.5" ry="13" fill="#fff" opacity="0.85" transform="rotate(225)"/>
+    <ellipse cx="0" cy="-22" rx="6.5" ry="13" fill="#fff" opacity="0.85" transform="rotate(270)"/>
+    <ellipse cx="0" cy="-22" rx="6.5" ry="13" fill="#fff" opacity="0.85" transform="rotate(315)"/>
+    <circle cx="0" cy="0" r="8" fill="#268a52" stroke="#fff" stroke-width="2"/>
+  </g>
+</svg>