diff --git a/apps/www/components/icons.tsx b/apps/www/components/icons.tsx
index 58f873d7be..327ff5e3b2 100644
--- a/apps/www/components/icons.tsx
+++ b/apps/www/components/icons.tsx
@@ -29,8 +29,14 @@ export const Icons = {
     </svg>
   ),
   twitter: (props: IconProps) => (
-    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" {...props}>
-      <path d="M21.543 7.104c.015.211.015.423.015.636 0 6.507-4.954 14.01-14.01 14.01v-.003A13.94 13.94 0 0 1 0 19.539a9.88 9.88 0 0 0 7.287-2.041 4.93 4.93 0 0 1-4.6-3.42 4.916 4.916 0 0 0 2.223-.084A4.926 4.926 0 0 1 .96 9.167v-.062a4.887 4.887 0 0 0 2.235.616A4.928 4.928 0 0 1 1.67 3.148a13.98 13.98 0 0 0 10.15 5.144 4.929 4.929 0 0 1 8.39-4.49 9.868 9.868 0 0 0 3.128-1.196 4.941 4.941 0 0 1-2.165 2.724A9.828 9.828 0 0 0 24 4.555a10.019 10.019 0 0 1-2.457 2.549z" />
+    <svg
+      {...props}
+      height="23"
+      viewBox="0 0 1200 1227"
+      width="23"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path d="M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z" />
     </svg>
   ),
   gitHub: (props: IconProps) => (
diff --git a/apps/www/components/site-header.tsx b/apps/www/components/site-header.tsx
index 3c13add4ad..0c7854a44a 100644
--- a/apps/www/components/site-header.tsx
+++ b/apps/www/components/site-header.tsx
@@ -50,7 +50,7 @@ export function SiteHeader() {
                   "w-9 px-0"
                 )}
               >
-                <Icons.twitter className="h-4 w-4 fill-current" />
+                <Icons.twitter className="h-3 w-3 fill-current" />
                 <span className="sr-only">Twitter</span>
               </div>
             </Link>
diff --git a/templates/next-template/components/icons.tsx b/templates/next-template/components/icons.tsx
index 3a00095b02..e7c323c54a 100644
--- a/templates/next-template/components/icons.tsx
+++ b/templates/next-template/components/icons.tsx
@@ -2,7 +2,6 @@ import {
   LucideProps,
   Moon,
   SunMedium,
-  Twitter,
   type Icon as LucideIcon,
 } from "lucide-react"
 
@@ -11,7 +10,17 @@ export type Icon = LucideIcon
 export const Icons = {
   sun: SunMedium,
   moon: Moon,
-  twitter: Twitter,
+  twitter: (props: LucideProps) => (
+    <svg
+      {...props}
+      height="23"
+      viewBox="0 0 1200 1227"
+      width="23"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path d="M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z" />
+    </svg>
+  ),
   logo: (props: LucideProps) => (
     <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" {...props}>
       <path
diff --git a/templates/next-template/components/site-header.tsx b/templates/next-template/components/site-header.tsx
index 91e7808703..ea45d04e5c 100644
--- a/templates/next-template/components/site-header.tsx
+++ b/templates/next-template/components/site-header.tsx
@@ -39,7 +39,7 @@ export function SiteHeader() {
                   variant: "ghost",
                 })}
               >
-                <Icons.twitter className="h-5 w-5 fill-current" />
+                <Icons.twitter className="h-4 w-4 fill-current" />
                 <span className="sr-only">Twitter</span>
               </div>
             </Link>