diff --git a/docs/.vuepress/components/links.ts b/docs/.vuepress/components/links.ts
new file mode 100644
index 0000000..bd85664
--- /dev/null
+++ b/docs/.vuepress/components/links.ts
@@ -0,0 +1,4 @@
+export const links = [
+    { logo: 'https://plus-doc.dromara.org/static/image/logo.png', title: 'RuoYi-Vue-Plus 多租户权限管理系统', desc: '真正面向企业级的应用框架\n组件化 模块化 轻耦合 高扩展 针对企业痛点 业界一流技术栈', link: 'https://plus-doc.dromara.org/#/' },
+    { logo: 'https://demo.orangeforms.com/img/login_logo2.424461a3.png', title: '橙单 —— 最纯粹的代码生成工具', desc: '80% 代码「免费」生成，全部源码交付，永久免费升级', link: 'https://www.orangeforms.com/' }
+]
\ No newline at end of file
diff --git a/docs/.vuepress/components/links.vue b/docs/.vuepress/components/links.vue
new file mode 100644
index 0000000..b9a0fe5
--- /dev/null
+++ b/docs/.vuepress/components/links.vue
@@ -0,0 +1,95 @@
+<template>
+  <div class="demo-container">
+    <div class="card card-side bg-base-100 shadow-xl" v-for="item in firendLinks" @click="toLink(item.link)">
+      <figure>
+        <img
+          :src="item.logo"
+          style="height: 80px"
+          alt="Logo" />
+      </figure>
+      <div class="card-body">
+        <div class="card-title">{{ item.title }}</div>
+        <div>{{ item.desc }}</div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { links } from "./links.ts";
+
+const firendLinks = links;
+
+function toLink(link) {
+    window.open(link, '_blank');
+}
+</script>
+
+<style>
+.demo-container {
+}
+
+.shadow-xl {
+    --tw-shadow-colored: 0 20px 25px -5px 0 0 #0000, 0 8px 10px -6px 0 0 #0000;
+    box-shadow: 0 0 #0000,0 0 #0000,0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1)
+}
+
+.bg-base-100 {
+    --tw-bg-opacity: 1;
+    background-color: var(--fallback-b1,oklch(100% 0 0/1))
+}
+
+.card :where(figure:first-child) {
+    overflow: hidden;
+    border-start-start-radius: inherit;
+    border-start-end-radius: inherit;
+    border-end-start-radius: unset;
+    border-end-end-radius: unset;
+}
+
+.card-side :where(figure:first-child) {
+    overflow: hidden;
+    border-start-start-radius: inherit;
+    border-start-end-radius: unset;
+    border-end-start-radius: inherit;
+    border-end-end-radius: unset;
+}
+
+.card-side {
+    align-items: stretch;
+    flex-direction: row;
+}
+
+.card figure {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding-left: 2rem;
+}
+
+.card {
+    position: relative;
+    display: flex;
+    border-radius: 1rem 1rem;
+    margin-bottom: 1rem;
+    cursor: pointer;
+}
+
+.card-body {
+    display: flex;
+    flex: 1 1 auto;
+    flex-direction: column;
+    padding: 2rem;
+    gap: .5rem;
+    justify-content: space-around;
+}
+
+.card-title {
+    display: flex;
+    align-items: center;
+    gap: .5rem;
+    font-size: 1.25rem;
+    line-height: 1.75rem;
+    font-weight: 600;
+}
+</style>
\ No newline at end of file
diff --git a/docs/README.md b/docs/README.md
index 8ebe737..255d777 100644
--- a/docs/README.md
+++ b/docs/README.md
@@ -46,12 +46,11 @@ footer:
   startYear: 2023
 ---
 
-## 国内站点
+## 友情链接
 
-- https://easii.gitee.io/mapstruct-plus/
+<links />
 
 ## 其他开源项目
-
 - **EasyRelation**：[GitHub](https://github.com/linpeilie/easy-relation) | [Gitee](https://gitee.com/easii/easy-relation) | [Document](https://easy-relation.easii.cn)
 
 ## 最新版本
@@ -127,12 +126,6 @@ implementation group: 'io.github.linpeilie', name: 'mapstruct-plus-spring-boot-s
 
 - [mapstruct-plus-深度拷贝一集精通](https://www.bilibili.com/video/BV1KM4y1E7GJ/)
 
-## 友情链接
-
-- [RuoYi-Vue-Plus](https://gitee.com/JavaLionLi/RuoYi-Vue-Plus/wikis/pages)
-- [RuoYi-Cloud-Plus](https://gitee.com/JavaLionLi/RuoYi-Cloud-Plus/wikis/pages)
-- [Stream-Query](http://stream-query.dromara.org/)：允许完全摆脱Mapper的mybatis-plus🌽体验！可以使用类似“工具类”🔧这样的静态函数进行数据库操作
-
 ## 联系我
 
 > 个人网站：[代码笔耕](https://easii.gitee.io)