纯前端生成设置头像 - 基于Vue3、Ts、Vite

本文介绍了基于Vue3、Ts和Vite的开源项目,该项目允许用户一键随机生成头像。项目使用了hooks和SVG进行头像生成和编辑,用户可以更换头像的五官。核心逻辑在于根据随机数决定头像的各个部分。同时,该项目支持国际化和主题色切换。源代码托管在Git,遵循MIT协议,素材基于CC BY 4.0协议。
摘要由CSDN通过智能技术生成

开头

最近要研究有什么新奇的产品和项目,发现一个网站很有意思,可以纯前端一键随机生成头像,刚好他们的代码是开源,并且基于vue3,我想开源拿出来给大家分享。

效果:

开始

项目本身基于vue3vite开发,github地址是:https://github.com/Codennnn/vue-color-avatar,启动步骤:

git clone https://github.com/Codennnn/vue-color-avatar.git
yarn 
yarn dev

访问:http://localhost:5000/即可访问项目

0346344f526b6b8b17477c4d67890137.png

项目布局本身分为四个大的区域:

Header
PlayGround
Footer
Sider

国际化使用的是vue-i18n

import { createI18n } from 'vue-i18n'

import { Locale } from '@/enums'

import en from '.
  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值