diff --git a/README.md b/README.md
index 17742ddd8..553739dfb 100644
--- a/README.md
+++ b/README.md
@@ -22,7 +22,7 @@ V3 Admin Vite is a well-crafted backend management system template, built with p
 > Version 4.x will no longer be maintained unless there are critical bugs! [Click to switch to the 4.x branch](https://github.com/un-pany/v3-admin-vite/tree/4.x)
 
 > [!TIP]
-> Paid services are officially launched! If you don’t want to do it yourself but want to remove TS or other modules, try the lazy package! [Click to check it out](https://github.com/un-pany/v3-admin-vite/issues/225)
+> Paid services are officially launched! If you don't want to do it yourself but want to remove TS or other modules, try the lazy package! [Click to check it out](https://github.com/un-pany/v3-admin-vite/issues/225)
 
 > [!NOTE]
 > If you have mobile web app requirements, give the new open-source template [MobVue](https://github.com/un-pany/mobvue) a try.
@@ -222,3 +222,84 @@ A big thank you to all the contributors!
 ## License
 
 [MIT](./LICENSE) License © 2022-PRESENT [pany](https://github.com/pany-ang)
+
+## 简介
+
+一个免费开源的中后台管理系统基础解决方案，基于 Vue3、TypeScript、Element Plus、Pinia 和 Vite 等主流技术.
+
+## 特性
+
+- **Vue3**：采用 Vue3 + script setup 最新的 Vue3 组合式 API
+- **Element Plus**：Element UI 的 Vue3 版本
+- **Pinia**: 传说中的 Vuex5
+- **Vite**：真的很快
+- **Vue Router**：路由路由
+- **TypeScript**：JavaScript 语言的超集
+- **PNPM**：更快速的，节省磁盘空间的包管理工具
+- **Scss**：和 Element Plus 保持一致
+- **CSS 变量**：主要控制项目的布局和颜色
+- **ESlint**：代码校验
+- **Prettier**：代码格式化
+- **Axios**：发送网络请求（已封装好）
+- **UnoCSS**：具有高性能且极具灵活性的即时原子化 CSS 引擎
+- **注释**：各个配置项都写有尽可能详细的注释
+- **兼容移动端**: 布局兼容移动端页面分辨率
+
+## 功能
+
+- **用户管理**：登录、登出演示
+- **权限管理**：内置页面权限（动态路由）、指令权限、权限函数、路由守卫
+- **多环境**：开发环境（development）、预发布环境（staging）、正式环境（production）
+- **多主题**：内置普通、黑暗、深蓝三种主题模式
+- **错误页面**: 403、404
+- **Dashboard**：根据不同用户显示不同的 Dashboard 页面
+- **其他内置功能**：SVG、动态侧边栏、动态面包屑、标签页快捷导航、Screenfull 全屏、自适应收缩侧边栏、Hook（Composables）
+
+## 📝 配置
+
+### TinyMCE 富文本编辑器
+
+本项目集成了 TinyMCE 富文本编辑器，使用前需要：
+
+1. 前往 [TinyMCE 官网](https://www.tiny.cloud/) 注册账号并获取 API Key
+2. 在项目根目录创建 `.env.development` 文件（如果不存在），添加以下配置：
+
+```bash
+# TinyMCE API Key
+VITE_TINYMCE_API_KEY='qakh29dtwy4honhyvvcu3xi4l1zw3l0w7f55z8fcru52nidw'
+```
+
+将 `your-api-key` 替换为你的实际 API Key。
+
+## 安装使用
+
+- 获取项目代码
+
+```bash
+git clone https://github.com/un-pany/v3-admin-vite.git
+```
+
+- 安装依赖
+
+```bash
+cd v3-admin-vite
+
+pnpm install
+
+```
+
+- 运行
+
+```bash
+pnpm dev
+```
+
+- 打包
+
+```bash
+pnpm build:prod
+```
+
+## 更新日志
+
+[CHANGELOG](./CHANGELOG.md)
diff --git a/package.json b/package.json
index c19da78cb..299199eca 100644
--- a/package.json
+++ b/package.json
@@ -16,6 +16,7 @@
   },
   "dependencies": {
     "@element-plus/icons-vue": "2.3.1",
+    "@tinymce/tinymce-vue": "^5.1.1",
     "axios": "1.10.0",
     "dayjs": "1.11.13",
     "element-plus": "2.10.2",
@@ -28,6 +29,7 @@
     "path-to-regexp": "8.2.0",
     "pinia": "3.0.3",
     "screenfull": "6.0.2",
+    "tinymce": "^6.8.3",
     "vue": "3.5.17",
     "vue-router": "4.5.1",
     "vxe-table": "4.6.25"
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 43c138472..5cb5798b1 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -11,6 +11,9 @@ importers:
       '@element-plus/icons-vue':
         specifier: 2.3.1
         version: 2.3.1(vue@3.5.17(typescript@5.8.3))
+      '@tinymce/tinymce-vue':
+        specifier: ^5.1.1
+        version: 5.1.1(vue@3.5.17(typescript@5.8.3))
       axios:
         specifier: 1.10.0
         version: 1.10.0
@@ -47,6 +50,9 @@ importers:
       screenfull:
         specifier: 6.0.2
         version: 6.0.2
+      tinymce:
+        specifier: ^6.8.3
+        version: 6.8.6
       vue:
         specifier: 3.5.17
         version: 3.5.17(typescript@5.8.3)
@@ -760,6 +766,11 @@ packages:
   '@sxzz/popperjs-es@2.11.7':
     resolution: {integrity: sha512-Ccy0NlLkzr0Ex2FKvh2X+OyERHXJ88XJ1MXtsI9y9fGexlaXaVTPzBCRBwIxFkORuOb+uBqeu+RqnpgYTEZRUQ==}
 
+  '@tinymce/tinymce-vue@5.1.1':
+    resolution: {integrity: sha512-iO57HOWesFOhsaqjA5Ea6sDvQBmJJH3/dq00Uvg7metlct2kLF+ctRgoDsetLt6gmeZ7COPftr814/XzqnJ/dg==}
+    peerDependencies:
+      vue: ^3.0.0
+
   '@trysound/sax@0.2.0':
     resolution: {integrity: sha512-L7z9BgrNEcYyUYtF+HaEfiS5ebkh9jXqbszz7pC0hRBPaatV0XjSD3+eHrpqFemQfgwiFF0QPIarnIihIDn7OA==}
     engines: {node: '>=10.13.0'}
@@ -2969,6 +2980,9 @@ packages:
     resolution: {integrity: sha512-tX5e7OM1HnYr2+a2C/4V0htOcSQcoSTH9KgJnVvNm5zm/cyEWKJ7j7YutsH9CxMdtOkkLFy2AHrMci9IM8IPZQ==}
     engines: {node: '>=12.0.0'}
 
+  tinymce@6.8.6:
+    resolution: {integrity: sha512-++XYEs8lKWvZxDCjrr8Baiw7KiikraZ5JkLMg6EdnUVNKJui0IsrAADj5MsyUeFkcEryfn2jd3p09H7REvewyg==}
+
   tinypool@1.1.1:
     resolution: {integrity: sha512-Zba82s87IFq9A9XmjiX5uZA/ARWDrB03OHlq+Vw1fSdt0I+4/Kutwy8BP4Y/y/aORMo61FQ0vIb5j44vSo5Pkg==}
     engines: {node: ^18.0.0 || >=20.0.0}
@@ -3832,6 +3846,11 @@ snapshots:
 
   '@sxzz/popperjs-es@2.11.7': {}
 
+  '@tinymce/tinymce-vue@5.1.1(vue@3.5.17(typescript@5.8.3))':
+    dependencies:
+      tinymce: 6.8.6
+      vue: 3.5.17(typescript@5.8.3)
+
   '@trysound/sax@0.2.0': {}
 
   '@types/chai@5.2.2':
@@ -6381,6 +6400,8 @@ snapshots:
       fdir: 6.4.6(picomatch@4.0.2)
       picomatch: 4.0.2
 
+  tinymce@6.8.6: {}
+
   tinypool@1.1.1: {}
 
   tinyrainbow@2.0.0: {}
diff --git a/src/common/components/Editor/index.vue b/src/common/components/Editor/index.vue
new file mode 100644
index 000000000..f02e11cab
--- /dev/null
+++ b/src/common/components/Editor/index.vue
@@ -0,0 +1,104 @@
+<script lang="ts" setup>
+import Editor from "@tinymce/tinymce-vue"
+import { ref } from "vue"
+
+interface Props {
+  /** 编辑器内容 */
+  modelValue?: string
+  /** 编辑器高度 */
+  height?: number | string
+  /** 是否只读 */
+  readonly?: boolean
+  /** 占位文本 */
+  placeholder?: string
+}
+
+interface Emits {
+  (e: "update:modelValue", value: string): void
+  (e: "change", value: string): void
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  modelValue: "",
+  height: 400,
+  readonly: false,
+  placeholder: "请输入内容"
+})
+
+const emit = defineEmits<Emits>()
+
+const editorRef = ref()
+
+// TinyMCE 配置
+const init = {
+  language: "zh_CN",
+  menubar: "file edit view insert format tools table help",
+  plugins: [
+    "advlist",
+    "autolink",
+    "lists",
+    "link",
+    "image",
+    "charmap",
+    "preview",
+    "anchor",
+    "searchreplace",
+    "visualblocks",
+    "code",
+    "fullscreen",
+    "insertdatetime",
+    "media",
+    "table",
+    "code",
+    "help",
+    "wordcount"
+  ],
+  toolbar: "undo redo | blocks | "
+    + "bold italic forecolor | alignleft aligncenter "
+    + "alignright alignjustify | bullist numlist outdent indent | "
+    + "removeformat | help",
+  content_style: "body { font-family:Helvetica,Arial,sans-serif; font-size:14px }",
+  readonly: props.readonly,
+  placeholder: props.placeholder,
+  branding: false, // 去除 TinyMCE 品牌标识
+  promotion: false // 去除推广信息
+}
+
+// 内容变化时触发
+function handleChange(value: string) {
+  emit("update:modelValue", value)
+  emit("change", value)
+}
+
+// 获取编辑器实例
+function getEditor() {
+  return editorRef.value?.editor
+}
+
+defineExpose({
+  getEditor
+})
+</script>
+
+<template>
+  <div class="v3-editor">
+    <Editor
+      ref="editorRef"
+      api-key="qakh29dtwy4honhyvvcu3xi4l1zw3l0w7f55z8fcru52nidw"
+      :init="init"
+      :model-value="modelValue"
+      :disabled="readonly"
+      :height="height"
+      @update:model-value="handleChange"
+    />
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.v3-editor {
+  :deep(.tox-tinymce) {
+    border-radius: 4px;
+    border-color: var(--el-border-color);
+  }
+}
+</style>
diff --git a/src/pages/demo/editor-demo/index.vue b/src/pages/demo/editor-demo/index.vue
new file mode 100644
index 000000000..b9478480a
--- /dev/null
+++ b/src/pages/demo/editor-demo/index.vue
@@ -0,0 +1,47 @@
+<script lang="ts" setup>
+import { ref } from "vue"
+import Editor from "@/common/components/Editor/index.vue"
+
+const content = ref("<p>Hello V3 Admin Vite!</p>")
+
+function handleChange(value: string) {
+  console.log("content changed:", value)
+}
+</script>
+
+<template>
+  <div class="app-container">
+    <el-card header="富文本编辑器示例">
+      <Editor v-model="content" @change="handleChange" />
+      <div class="preview-container">
+        <h3>HTML 预览:</h3>
+        <div v-html="content" class="preview-content" />
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.preview-container {
+  margin-top: 20px;
+  padding: 20px;
+  border: 1px solid var(--el-border-color-light);
+  border-radius: 4px;
+
+  h3 {
+    margin: 0 0 10px;
+    font-size: 16px;
+    color: var(--el-text-color-primary);
+  }
+
+  .preview-content {
+    padding: 15px;
+    background-color: var(--el-bg-color-page);
+    border-radius: 4px;
+
+    :deep(img) {
+      max-width: 100%;
+    }
+  }
+}
+</style>
diff --git a/src/router/index.ts b/src/router/index.ts
index 1908b8cd4..3343a8379 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -99,6 +99,15 @@ export const constantRoutes: RouteRecordRaw[] = [
           keepAlive: true
         }
       },
+      {
+        path: "editor",
+        component: () => import("@/pages/demo/editor-demo/index.vue"),
+        name: "Editor",
+        meta: {
+          title: "富文本编辑器",
+          keepAlive: true
+        }
+      },
       {
         path: "level2",
         component: () => import("@/pages/demo/level2/index.vue"),