diff --git a/README.md b/README.md
index dbb12ca..426fbbf 100644
--- a/README.md
+++ b/README.md
@@ -1,16 +1,151 @@
-[![Typing SVG](https://readme-typing-svg.demolab.com?font=Fira+Code&size=25&pause=1000&center=true&repeat=false&width=435&lines=WonderLand+%E2%80%94%E2%80%94+Wonder's+Land)](https://git.io/typing-svg)
+<h1 align="center">你好，我是 Wonder 👋</h1>
+<p align="center">
+  <a href="http://47.121.181.112:3000/wonder">
+    <img alt="Gitea 仓库" src="https://img.shields.io/badge/Gitea-自建仓库-blue?style=flat&logo=gitea">
+  </a>
+  <a href="http://47.121.181.112:8080/resume/1">
+    <img alt="在线简历" src="https://img.shields.io/badge/简历-在线查看-green?style=flat&logo=readme">
+  </a>
+</p>
 
-<center>
-<img src="https://wakatime.com/badge/user/5b960c5b-a7d7-4a2d-bb6b-fdcef6171837.svg" 
-    style="max-width: 100%; height: auto;">
-</center>
+### 🧠 关于我
 
-<br/>
+- 📖 大三 · 计算机科学与技术
+- 🚀 Go 语言全栈方向
+- 📫 联系我: hezhaohui0807@163.com
 
-- 📋 我在服务器上部署了一个 `Reveal.js` 渲染的 `Slide`， 同时这也是我的 <u>个人简历</u> ，快来看看吧。
-    -  [🔗 Online Resume](http://47.121.181.112:8888/)
+### 🛠️ 技术栈
 
-<center>
-<img src="https://wakatime.com/share/@Wonder/0a742db2-537e-476d-812b-a22f7b3272fc.svg" 
-     style="max-width: 70%; height: auto; margin: 0 10px;">
-</center>
\ No newline at end of file
+<div style="
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+    gap: 1rem;
+    margin-top: 1.5rem;
+">
+
+  <!-- 编程语言 -->
+  <div style="
+      background: #f3f4f6;
+      padding: 1.5rem;
+      border-radius: 0.5rem;
+      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+      display: flex;
+      flex-direction: column;
+      gap: 0.5rem;
+  ">
+    <div style="display: flex; gap: 0.5rem; align-items: center;">
+      <img src="https://skillicons.dev/icons?i=java" title="Java" alt="Java" style="height:2rem;" />
+      <img src="https://skillicons.dev/icons?i=go" title="Go" alt="Go" style="height:2rem;" />
+    </div>
+    <h4 style="margin: 0; color: #2563eb;">编程语言</h4>
+    <ul style="margin: 0; padding-left: 1.2rem; color: #374151; line-height: 1.7;">
+      <li>熟练 Java 与 Go，熟悉并发模型、内存管理、常用数据结构</li>
+    </ul>
+  </div>
+
+  <!-- Web 框架 -->
+  <div style="
+      background: #f3f4f6;
+      padding: 1.5rem;
+      border-radius: 0.5rem;
+      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+      display: flex;
+      flex-direction: column;
+      gap: 0.5rem;
+  ">
+    <div style="display: flex; gap: 0.5rem; align-items: center;">
+      <img src="https://skillicons.dev/icons?i=spring" title="Spring" alt="Spring" style="height:2rem;" />
+      <img src="https://skillicons.dev/icons?i=go" title="Go" alt="Go" style="height:2rem;" />
+    </div>
+    <h4 style="margin: 0; color: #2563eb;">Web 框架</h4>
+    <ul style="margin: 0; padding-left: 1.2rem; color: #374151; line-height: 1.7;">
+      <li>Spring / MyBatis / Spring Cloud</li>
+      <li>Gin / GORM / gRPC</li>
+    </ul>
+  </div>
+
+  <!-- 前端开发 -->
+  <div style="
+      background: #f3f4f6;
+      padding: 1.5rem;
+      border-radius: 0.5rem;
+      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+      display: flex;
+      flex-direction: column;
+      gap: 0.5rem;
+  ">
+    <div style="display: flex; gap: 0.5rem; align-items: center;">
+      <img src="https://skillicons.dev/icons?i=react" title="React" alt="React" style="height:2rem;" />
+      <img src="https://skillicons.dev/icons?i=nextjs" title="Next.js" alt="Next.js" style="height:2rem;" />
+    </div>
+    <h4 style="margin: 0; color: #2563eb;">前端开发</h4>
+    <ul style="margin: 0; padding-left: 1.2rem; color: #374151; line-height: 1.7;">
+      <li>React Hooks、状态管理（Zustand）</li>
+      <li>Vite、Tailwind CSS</li>
+    </ul>
+  </div>
+
+  <!-- 数据库 & 缓存 -->
+  <div style="
+      background: #f3f4f6;
+      padding: 1.5rem;
+      border-radius: 0.5rem;
+      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+      display: flex;
+      flex-direction: column;
+      gap: 0.5rem;
+  ">
+    <div style="display: flex; gap: 0.5rem; align-items: center;">
+      <img src="https://skillicons.dev/icons?i=mysql" title="MySQL" alt="MySQL" style="height:2rem;" />
+      <img src="https://skillicons.dev/icons?i=redis" title="Redis" alt="Redis" style="height:2rem;" />
+    </div>
+    <h4 style="margin: 0; color: #2563eb;">数据库 & 缓存</h4>
+    <ul style="margin: 0; padding-left: 1.2rem; color: #374151; line-height: 1.7;">
+      <li>MySQL 事务隔离、索引优化、MVCC</li>
+      <li>Redis 持久化、哨兵集群</li>
+    </ul>
+  </div>
+
+  <!-- AI & Agent -->
+  <div style="
+      background: #f3f4f6;
+      padding: 1.5rem;
+      border-radius: 0.5rem;
+      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+      display: flex;
+      flex-direction: column;
+      gap: 0.5rem;
+  ">
+    <div style="display: flex; gap: 0.5rem; align-items: center;">
+      <img src="https://cdn.simpleicons.org/claude" title="Claude AI" alt="Claude" style="height:2rem;" />
+    </div>
+    <h4 style="margin: 0; color: #2563eb;">AI & Agent</h4>
+    <ul style="margin: 0; padding-left: 1.2rem; color: #374151; line-height: 1.7;">
+      <li>Context Engineer</li>
+      <li>理解 ReAct、Reflect、Plan-Exec 等 Agent 架构</li>
+    </ul>
+  </div>
+
+  <!-- 工程工具 -->
+  <div style="
+      background: #f3f4f6;
+      padding: 1.5rem;
+      border-radius: 0.5rem;
+      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+      display: flex;
+      flex-direction: column;
+      gap: 0.5rem;
+  ">
+    <div style="display: flex; gap: 0.5rem; align-items: center;">
+      <img src="https://skillicons.dev/icons?i=docker" title="Docker" alt="Docker" style="height:2rem;" />
+      <img src="https://skillicons.dev/icons?i=git" title="Git" alt="Git" style="height:2rem;" />
+      <img src="https://skillicons.dev/icons?i=githubactions" title="GitHub Actions" alt="GitHub Actions" style="height:2rem;" />
+    </div>
+    <h4 style="margin: 0; color: #2563eb;">工程工具</h4>
+    <ul style="margin: 0; padding-left: 1.2rem; color: #374151; line-height: 1.7;">
+      <li>Docker、Git、Webhook</li>
+      <li>能搭建 CI/CD 工作流，良好的编码习惯</li>
+    </ul>
+  </div>
+
+</div>
\ No newline at end of file