diff --git a/README.md b/README.md
index 060a1ea..511ba54 100644
--- a/README.md
+++ b/README.md
@@ -1,5 +1,5 @@
 <div align="center">
-  <img src="logo.png" alt="微信数据库解密工具" width="200">
+  <img src="frontend/public/logo.png" alt="微信数据库解密工具" width="200">
 </div>
 
 # 微信数据库解密工具
@@ -62,6 +62,22 @@ npm run dev
 - API服务: http://localhost:8000
 - API文档: http://localhost:8000/docs
 
+## 界面预览
+
+### 检测页面
+<div align="center">
+  <img src="检测.jpg" alt="微信检测页面" width="800">
+</div>
+
+自动检测微信安装路径和数据库文件位置，支持多账户识别。
+
+### 解密页面
+<div align="center">
+  <img src="解密.jpg" alt="数据库解密页面" width="800">
+</div>
+
+输入解密密钥，选择数据库文件进行批量解密操作。
+
 ## 使用指南
 
 ### 获取解密密钥
diff --git a/frontend/nuxt.config.ts b/frontend/nuxt.config.ts
index 95bfdef..44bb962 100644
--- a/frontend/nuxt.config.ts
+++ b/frontend/nuxt.config.ts
@@ -26,6 +26,9 @@ export default defineNuxtConfig({
         { charset: 'utf-8' },
         { name: 'viewport', content: 'width=device-width, initial-scale=1' },
         { name: 'description', content: '微信4.x版本数据库解密工具' }
+      ],
+      link: [
+        { rel: 'icon', type: 'image/png', href: '/logo.png' }
       ]
     },
     pageTransition: { name: 'page', mode: 'out-in' }
diff --git a/frontend/pages/index.vue b/frontend/pages/index.vue
index 3ce710e..adc4e89 100644
--- a/frontend/pages/index.vue
+++ b/frontend/pages/index.vue
@@ -10,8 +10,13 @@
     
     <!-- 主要内容区域 -->
     <div class="relative z-10 text-center">
-      <!-- 标题部分 -->
+      <!-- Logo和标题部分 -->
       <div class="mb-12 animate-fade-in">
+        <!-- Logo -->
+        <div class="flex justify-center mb-8">
+          <img src="/logo.png" alt="微信解密助手Logo" class="w-48 h-48 object-contain">
+        </div>
+        
         <h1 class="text-5xl font-bold text-[#000000e6] mb-4">
           <span class="bg-gradient-to-r from-[#07C160] to-[#10AEEF] bg-clip-text text-transparent">微信</span>
           <span class="text-[#000000e6]">解密助手</span>
diff --git a/frontend/public/logo.png b/frontend/public/logo.png
new file mode 100644
index 0000000..1efeb87
Binary files /dev/null and b/frontend/public/logo.png differ
diff --git a/logo.png b/logo.png
deleted file mode 100644
index d144de1..0000000
Binary files a/logo.png and /dev/null differ
diff --git a/检测.jpg b/检测.jpg
new file mode 100644
index 0000000..b9a1336
Binary files /dev/null and b/检测.jpg differ
diff --git a/解密.jpg b/解密.jpg
new file mode 100644
index 0000000..084f571
Binary files /dev/null and b/解密.jpg differ