diff --git a/src/components/header/index.tsx b/src/components/header/index.tsx
index e37aa1f..718e8b3 100644
--- a/src/components/header/index.tsx
+++ b/src/components/header/index.tsx
@@ -17,6 +17,12 @@ function GoTop() {
   )
 }
 
+function Github() {
+  return (
+    <button type="button" title="Github" className="i-ph:github-logo-duotone btn" onClick={() => window.open(Homepage)} />
+  )
+}
+
 function Refresh() {
   const currentSources = useAtomValue(currentSourcesAtom)
   const { refresh } = useRefetch()
@@ -65,6 +71,7 @@ export function Header() {
       <span className="justify-self-end flex gap-2 items-center text-xl text-primary-600 dark:text-primary">
         <GoTop />
         <Refresh />
+        <Github />
         <Menu />
       </span>
     </>
diff --git a/src/components/header/menu.tsx b/src/components/header/menu.tsx
index baebd46..49fed11 100644
--- a/src/components/header/menu.tsx
+++ b/src/components/header/menu.tsx
@@ -75,7 +75,7 @@ export function Menu() {
                 >
                   <img
                     alt="GitHub stars badge"
-                    src="https://img.shields.io/github/stars/ourongxing/newsnow?logo=github"
+                    src="https://img.shields.io/github/stars/ourongxing/newsnow?logo=github&style=flat&labelColor=%235e3c40&color=%23614447"
                   />
                 </a>
                 <a
@@ -83,7 +83,7 @@ export function Menu() {
                 >
                   <img
                     alt="GitHub forks badge"
-                    src="https://img.shields.io/github/forks/ourongxing/newsnow?logo=github"
+                    src="https://img.shields.io/github/forks/ourongxing/newsnow?logo=github&style=flat&labelColor=%235e3c40&color=%23614447"
                   />
                 </a>
               </li>