分享一个 Vue3 + Vite 开发的纯前端在线头像生成网站 🥳

[coolpace]

项目链接

在线预览：https://vue-color-avatar.vercel.app

GitHub 源码：https://github.com/Codennnn/vue-color-avatar

项目介绍

这是一款矢量风格头像的生成器，你可以搭配不同的素材组件，生成自己的个性化头像。

你可能感兴趣的功能：

• 可视化组件配置栏
• 随机生成头像，有一定概率触发彩蛋
• 撤销 /还原更改
• 国际化多语言

设计资源

• 设计师：@Micah on Figma
• 素材来源：Avatar Illustration System

附言

这个项目是我学习 Vue3 之后写第一个网站，里面有一些个人认为较好的代码实践，包括 Typescript 的应用和 ESLint + Prettier 的配置，希望对你有帮助。

喜欢的话请给这个项目一个 Star ⭐ 吧～

[draven511250]

蛮有意思的。

[zsxzy]

配色挺好

[DearMark]

赏起来

[itning]

可以啊

[MzM2ODkx]

有点意思

[ixoy]

之前也看到过一个 notion 头像生成器 https://notion-avatar.vercel.app/zh
可参考参考

[Livid]

有没有考虑过做成 NFT Collection ？

[yl20181003]

挺有意思

[dfourc]

UI 真不错

[coolpace]

@Livid [楼主回复]
抱歉，我还不知道什么是 NFT Collection，我先去搜索一下相关信息 😉

[coolpace]

@ixoy [楼主回复]
我开发的时候也参考了这个项目！~

[Livid]

@coolpace 比如这样的：

https://opensea.io/collection/cool-cats-nft

[QUC062IzY3M1Y6dg]

真不错

[ALVC666]

好！ 本搬砖狗表示让我实现可以 但是让我去设计出来这么一个真的好难
毫无设计能力 只知道好看还是不好看

[Pyrex23]

之前看到过一些一模一样的。。

https://github.com/holiday-lab/holiday-avatar

[coolpace]

@Livid [楼主回复]
非常酷！感谢提供的信息，我会去了解更多细节的

[coolpace]

@Pyrex23 [楼主回复#15]
嗯哼，这种风格的头像还挺受欢迎的

[tribute]

针不戳

[beiyu]

很棒,喜欢楼主的设计风格．

[stefanieewu]

设计很喜欢，不过好像随机生成，只是在一个随机池里随便选一个？

[coolpace]

@stefanieewu [楼主回复#20]
可以这么理解，每个头像部位的选项都是一个数组定义，从数组里随机选取一个与其他部位进行组合

[est]

NFT 搞起来 2333

[Remember]

捏脸好评,可惜就是选项还是太少了,希望搞丰富一点

[shilianmlxg]

多谢大佬 可以多学亿点点东西

[tousfun]

大佬为什么初学就能做出来这么好玩的项目啊？之前有前端经验吗

[coolpace]

@Remember [楼主回复#23]
看来大家都挺喜欢这种风格的头像，我准备找设计师画一波素材

[coolpace]

@919615766 [楼主回复#25]
我的主业是前端开发

[leonleung]

用这换了个波头像

[coolpace]

@leonleung [楼主回复#28]
谢谢支持，我计划近期再更新一波头像素材，可以关注我的项目获取最新状态哦

[cond0r]

用上了 感谢楼主

[lovegoogle]

建议加上用上 GAN （生成对抗网络）随机生成各种有趣风格的图片 ^_^

[yunyuyuan]

我要是也认识一个设计朋友就好了，作为前端写的网站自己都不忍直视

[coolpace]

@lovegoogle [楼主回复#31]
赶紧查了查什么是对抗网络 🧐

[coolpace]

@yunyuyuan [楼主回复#32]
在模仿中慢慢培养审美吧哈哈

[jinzhe]

左边主界面出来滚动条有点丑

[coolpace]

@jinzhe [楼主回复#35]
正常情况是没有滚动条的，可以说下怎么复现吗？

[six6pear]

不错，很喜欢。就是现阶段素材太少，望完善。

[starxg]

很好！

[lsorrow]

胡子直接盖在嘴巴上了哈哈哈

[jinzhe]

@coolpace 直接打开就有了，macOS chrome macbook pro

[t298]

喜欢

[uTuw2C6uf964Kx6o]

风格不错

[zzl22100048]

随机生成比我自己捏的好看。。。

[PEAL]

爱了爱了

[akakidz]

cool

[sakuno]

用上了 感谢楼主

[chenz197]

牛