学习如何使用JavaScript 生成各种好看的头像!

2021-12-01 15:33:34 浏览数 (1)

大家好,我是TJ

一个励志推荐10000款开源项目与工具的程序员

平时大家在用微信聊天或者发朋友圈的时候,都会希望什么呢?受人敬仰?彰显帅气?体现睿智?TJ君觉得,可能有一点是大家都会在意的,就是有一个特立独行却又让别人称赞、过目不忘的好看头像吧。

今天TJ君就给大家来分享一个使用 Vite Vue3 开发的纯前端实现的开源头像生成网站。

Color Avatar

网站整体是一款矢量风格头像的生成器,用户可以搭配不同的素材组件,生成自己的个性化头像!来看看具体的头像生成效果:

是不是出乎意料的素材丰富呢?用户可以选择:

  • 3种头像形状
  • 18种背景颜色
  • 9种发型
  • 2种耳朵
  • 3种耳环
  • 4种眉毛
  • 4种眼睛
  • 3种鼻子
  • 3种眼镜
  • 8种嘴巴
  • 不同的胡子、衣着

依靠这些不同的素材,绝对可以打造出一个让人过目不忘的专属头像,同时网站还提供随机生成功能、图片下载功能,并对挑选好的头像图片可以直接查看其代码组成再加上一键复制代码,就像这样:

如何运行项目?

  • step1 克隆项目至本地
  • step2 安装项目依赖
    • yarn install
  • step3 运行项目
    • yarn dev

TJ君觉得项目对于想学习Vue3语法或者想掌握相关项目搭建的小伙伴还是很不错的选择。

0 人点赞