diff --git a/apps/vue-color-avatar/README.md b/apps/vue-color-avatar/README.md
new file mode 100644
index 00000000..2caaf147
--- /dev/null
+++ b/apps/vue-color-avatar/README.md
@@ -0,0 +1,6 @@
+<div align="center">
+  <h1>Vue Color Avatar</h1>
+
+  <p>🧑‍🦱 一个纯前端实现的头像生成网站 🧑‍🦳</p>
+
+[Read in English](https://github.com/Codennnn/vue-color-avatar/blob/main/README.md)
diff --git a/apps/vue-color-avatar/data.yml b/apps/vue-color-avatar/data.yml
new file mode 100644
index 00000000..4eecbc8a
--- /dev/null
+++ b/apps/vue-color-avatar/data.yml
@@ -0,0 +1,19 @@
+name: Vue Color Avatar
+tags:
+    - 实用工具
+title: 一个纯前端实现的头像生成网站
+description: 一个纯前端实现的头像生成网站
+additionalProperties:
+    key: vue-color-avatar
+    name: Vue Color Avatar
+    tags:
+        - Tool
+    shortDescZh: 一个纯前端实现的头像生成网站
+    shortDescEn: A playful avatar generator
+    type: tool
+    crossVersionUpdate: true
+    limit: 0
+    recommend: 0
+    website: https://vue-color-avatar.leoku.dev
+    github: https://github.com/Codennnn/vue-color-avatar
+    document: https://github.com/Codennnn/vue-color-avatar
diff --git a/apps/vue-color-avatar/latest/.env.sample b/apps/vue-color-avatar/latest/.env.sample
new file mode 100644
index 00000000..9f2289d8
--- /dev/null
+++ b/apps/vue-color-avatar/latest/.env.sample
@@ -0,0 +1,2 @@
+CONTAINER_NAME="vue-color-avatar"
+PANEL_APP_PORT_HTTP="40247"
diff --git a/apps/vue-color-avatar/latest/data.yml b/apps/vue-color-avatar/latest/data.yml
new file mode 100644
index 00000000..ea3be565
--- /dev/null
+++ b/apps/vue-color-avatar/latest/data.yml
@@ -0,0 +1,10 @@
+additionalProperties:
+  formFields:
+    - default: 40247
+      edit: true
+      envKey: PANEL_APP_PORT_HTTP
+      labelEn: Port
+      labelZh: 端口
+      required: true
+      rule: paramPort
+      type: number
diff --git a/apps/vue-color-avatar/latest/docker-compose.yml b/apps/vue-color-avatar/latest/docker-compose.yml
new file mode 100644
index 00000000..ce194d15
--- /dev/null
+++ b/apps/vue-color-avatar/latest/docker-compose.yml
@@ -0,0 +1,13 @@
+version: '3.3'
+services:
+  vue-color-avatar:
+    image: wenyang0/vue-color-avatar:latest
+    container_name: ${CONTAINER_NAME}
+    restart: always
+    ports:
+      - "${PANEL_APP_PORT_HTTP}:5173"
+    labels:
+      createdBy: "Apps"
+networks:
+  1panel-network:
+    external: true
\ No newline at end of file
diff --git a/apps/vue-color-avatar/logo.png b/apps/vue-color-avatar/logo.png
new file mode 100644
index 00000000..f2c98c67
Binary files /dev/null and b/apps/vue-color-avatar/logo.png differ