diff --git a/next-tauri/src-tauri/icons/128x128.png b/next-tauri/src-tauri/icons/128x128.png
index 556b043b..26c32af4 100644
Binary files a/next-tauri/src-tauri/icons/128x128.png and b/next-tauri/src-tauri/icons/128x128.png differ
diff --git a/next-tauri/src-tauri/icons/128x128@2x.png b/next-tauri/src-tauri/icons/128x128@2x.png
index e188753d..74bdf58a 100644
Binary files a/next-tauri/src-tauri/icons/128x128@2x.png and b/next-tauri/src-tauri/icons/128x128@2x.png differ
diff --git a/next-tauri/src-tauri/icons/32x32.png b/next-tauri/src-tauri/icons/32x32.png
index 8bdcf175..422ef970 100644
Binary files a/next-tauri/src-tauri/icons/32x32.png and b/next-tauri/src-tauri/icons/32x32.png differ
diff --git a/next-tauri/src-tauri/icons/64x64.png b/next-tauri/src-tauri/icons/64x64.png
index de69572d..f3ad3f77 100644
Binary files a/next-tauri/src-tauri/icons/64x64.png and b/next-tauri/src-tauri/icons/64x64.png differ
diff --git a/next-tauri/src-tauri/icons/icon.png b/next-tauri/src-tauri/icons/icon.png
index b16b46c1..74bdf58a 100644
Binary files a/next-tauri/src-tauri/icons/icon.png and b/next-tauri/src-tauri/icons/icon.png differ
diff --git a/next-tauri/src/app/App.tsx b/next-tauri/src/app/App.tsx
index 2842f629..fbe936cf 100644
--- a/next-tauri/src/app/App.tsx
+++ b/next-tauri/src/app/App.tsx
@@ -11,6 +11,7 @@ import {
   Settings
 } from 'lucide-react'
 import { useEffect, useMemo, useState } from 'react'
+import brandLogo from '../assets/brand/mootool-logo.png'
 import { CalculatorHost } from '../features/calculator/CalculatorHost'
 import { ColorHost } from '../features/color/ColorHost'
 import { CryptoHost } from '../features/crypto/CryptoHost'
@@ -355,7 +356,7 @@ export function App() {
 
         <footer className="sidebar-footer">
           <div className="brand-lockup">
-            <span className="brand-symbol"><Boxes /></span>
+            <img className="brand-symbol" src={brandLogo} alt="" aria-hidden="true" draggable={false} />
             <span>MooTool <small>Tauri</small></span>
           </div>
           <div className="footer-actions">
diff --git a/next-tauri/src/assets/brand/mootool-logo.png b/next-tauri/src/assets/brand/mootool-logo.png
new file mode 100644
index 00000000..74bdf58a
Binary files /dev/null and b/next-tauri/src/assets/brand/mootool-logo.png differ
diff --git a/next-tauri/src/features/home/HomePage.tsx b/next-tauri/src/features/home/HomePage.tsx
index 7da690fd..3a8fc796 100644
--- a/next-tauri/src/features/home/HomePage.tsx
+++ b/next-tauri/src/features/home/HomePage.tsx
@@ -1,5 +1,4 @@
 import {
-  Boxes,
   CheckCircle2,
   Cpu,
   Database,
@@ -14,6 +13,7 @@ import {
 import { useI18n } from '../../app/i18n'
 import type { RuntimeInfo } from '../../platform/contracts/runtime'
 import sponsorQrImage from '../../../../assets/material/wx-zanshang.jpg'
+import brandLogo from '../../assets/brand/mootool-logo.png'
 
 interface HomePageProps {
   runtimeInfo?: RuntimeInfo
@@ -48,7 +48,7 @@ export function HomePage({ runtimeInfo, onOpenJson }: HomePageProps) {
             aria-label={t('app.home.website')}
             onClick={() => openExternalPage('https://mootool.luoboduner.com')}
           >
-            <div className="brand-symbol brand-symbol--large"><Boxes aria-hidden="true" /></div>
+            <img className="brand-symbol brand-symbol--large" src={brandLogo} alt="" aria-hidden="true" draggable={false} />
           </button>
 
           <div className="home-identity">
diff --git a/next-tauri/src/styles.css b/next-tauri/src/styles.css
index 2fa78ce0..81365756 100644
--- a/next-tauri/src/styles.css
+++ b/next-tauri/src/styles.css
@@ -293,31 +293,20 @@ svg {
 }
 
 .brand-symbol {
-  display: inline-grid;
+  display: block;
   width: 29px;
   height: 29px;
   flex: 0 0 auto;
-  place-items: center;
   border-radius: 9px;
-  background: linear-gradient(145deg, #4384ff, #245dcc);
-  box-shadow: 0 5px 12px rgba(47, 111, 237, 0.24);
-  color: white;
-}
-
-.brand-symbol svg {
-  width: 17px;
-  height: 17px;
+  object-fit: cover;
+  background: transparent;
+  box-shadow: none;
 }
 
 .brand-symbol--large {
   width: 86px;
   height: 86px;
-  border-radius: 24px;
-}
-
-.brand-symbol--large svg {
-  width: 46px;
-  height: 46px;
+  border-radius: 18px;
 }
 
 .footer-actions {
@@ -421,6 +410,7 @@ svg {
 .home-logo-button .brand-symbol {
   width: 104px;
   height: 104px;
+  border-radius: 24px;
 }
 
 .home-identity {