diff --git a/app/components/home-social-links.tsx b/app/components/home-social-links.tsx
index 8498561..ffc590a 100644
--- a/app/components/home-social-links.tsx
+++ b/app/components/home-social-links.tsx
@@ -3,7 +3,7 @@
 import type { ReactNode } from "react";
 import HoverTip from "./hover-tip";
 
-type SocialBrand = "email" | "github" | "linkedin" | "spotify";
+type SocialBrand = "email" | "github" | "x" | "linkedin" | "spotify";
 
 const SOCIAL_LINKS: Array<{
   href: string;
@@ -51,6 +51,18 @@ const SOCIAL_LINKS: Array<{
       </svg>
     ),
   },
+  {
+    href: "https://x.com/kaichen37",
+    label: "X",
+    ariaLabel: "X (Twitter)",
+    brand: "x",
+    external: true,
+    icon: (
+      <svg viewBox="0 0 24 24" fill="currentColor" aria-hidden>
+        <path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24h-6.657l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+      </svg>
+    ),
+  },
   {
     href: "https://open.spotify.com/user/31xktcnl7hl34lu4windhu5uwji4?si=46cd7158fc2a4ab0",
     label: "Spotify",
diff --git a/app/globals.css b/app/globals.css
index f754395..56d651d 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -458,10 +458,12 @@ button.mag-chip:disabled {
 }
 .home-social-link--email:hover,
 .home-social-link--github:hover,
+.home-social-link--x:hover,
 .home-social-link--linkedin:hover,
 .home-social-link--spotify:hover { color: #000000; } /* zinc-950 — 深灰 */
 .dark .home-social-link--email:hover,
 .dark .home-social-link--github:hover,
+.dark .home-social-link--x:hover,
 .dark .home-social-link--linkedin:hover,
 .dark .home-social-link--spotify:hover { color: #ffffff; } /* zinc-50 — 近白 */
 .home-social-link svg {