https://github.com/codennnn/vue-color-avatar
An online avatar generator just for fun | 一个纯前端实现的头像生成网站
https://github.com/codennnn/vue-color-avatar
avatar avatar-generator avatar-maker vite vue3
Last synced: about 1 month ago
JSON representation
An online avatar generator just for fun | 一个纯前端实现的头像生成网站
- Host: GitHub
- URL: https://github.com/codennnn/vue-color-avatar
- Owner: Codennnn
- License: mit
- Created: 2021-10-16T08:38:11.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2025-04-21T05:56:02.000Z (about 2 months ago)
- Last Synced: 2025-04-29T18:58:56.062Z (about 1 month ago)
- Topics: avatar, avatar-generator, avatar-maker, vite, vue3
- Language: Vue
- Homepage: https://vue-color-avatar.leoku.dev
- Size: 3.88 MB
- Stars: 3,548
- Watchers: 9
- Forks: 464
- Open Issues: 1
-
Metadata Files:
- Readme: README-CN.md
- License: LICENSE
Awesome Lists containing this project
README
Vue Color Avatar
🧑🦱 一个纯前端实现的头像生成网站 🧑🦳
[Read in English](./README.md)
## 在线预览
[`https://vue-color-avatar.leoku.dev`](https://vue-color-avatar.leoku.dev)
## 介绍
**这是一款矢量风格头像的生成器，你可以搭配不同的素材组件，生成自己的个性化头像。**
你可能感兴趣的功能：
- 可视化组件配置栏
- 随机生成头像，有一定概率触发彩蛋
- 撤销/还原*更改*
- 国际化多语言
- 批量生成多个头像
## 设计资源
- 设计师：[@Micah](https://www.figma.com/@Micah) on Figma
- 素材来源：[Avatar Illustration System](https://www.figma.com/community/file/829741575478342595)
> **Note**
> 虽然该项目是 MIT 协议，但是素材资源基于 [CC BY 4.0](https://creativecommons.org/licenses/by/4.0/) 协议。如果你有好的创意素材，欢迎补充！
## 项目开发
该项目使用 `Vue3` + `Vite` 进行开发。
```sh
# 1. 克隆项目至本地
git clone https://github.com/Codennnn/vue-color-avatar.git
# 2. 安装项目依赖
yarn install
# 3. 运行项目
yarn dev
```
### Docker 快速部署
```sh
#下载代码
git clone https://github.com/Codennnn/vue-color-avatar.git
#docker 编译
cd vue-color-avatar/
docker build -t vue-color-avatar:latest .
#启动服务
docker run -d -p 3000:80 --name vue-color-avatar vue-color-avatar:latest
```
最后，打开你的浏览器访问服务的地址 http://localhost:3000 即可。