【web前端技术】dicebear一句话生成头像

【web前端技术】dicebear一句话生成头像dicebear 是一个专为程序开发者和设计者提供生成头像的 Javascript 库 你可以选择使用 HTTP API 来快速的调用官方的服务生成头像 也可以引入 npm 包来调用代码生成头像

在这里插入图片描述


前言

dicebear是一个专为程序开发者和设计者提供生成头像的Javascript库。你可以选择使用HTTP-API来快速的调用官方的服务生成头像,也可以引入npm包来调用代码生成头像。


一、dicebear体验

二、使用步骤

1.使用Http-API直接调用

官方提供的接口如下

https://avatars.dicebear.com/api/:sprites/:seed.svg 

在你的请求中,需要将:sprites替换为male, female, human, identicon, initials, bottts, avataaars, jdenticon, gridy 或者 micah:seed替换成任意的字符,但是不要是你个人的敏感信息。
此外,还支持指定一些特定的选项。比如,要指定一个蓝色的背景

https://avatars.dicebear.com/api/male/john.svg?background=%ff 

或者要指定头像中人物的表情

https://avatars.dicebear.com/api/male/john.svg?mood[]=happy&mood[]=sad 

你也可以指定API的版本

https://avatars.dicebear.com/4.6/api/:sprites/:seed.svg 

当前支持的版本有4.4, 4.5, 4.6, 4.7, 4.84.9.

2.使用npm将dicebear安装到你的项目

安装下面的两个包

npm install --save @dicebear/avatars npm install --save @dicebear/avatars-male-sprites 

然后使用下面的代码来生成头像

import { 
      createAvatar } from '@dicebear/avatars'; import * as style from '@dicebear/avatars-identicon-sprites'; let svg = createAvatar(style, { 
      seed: 'custom-seed', // ... and other options }); 

相关内容

以上就是本文的所有主要内容。通过本文,你可以了解到怎么调用dicebear来生成头像。此外,还有一些别的东西,如果你有兴趣,可以详细了解了解,最好阅读源码,以提升自己的编程水平。

1. 官方开源HTTP-API项目

2. 命令行模式

命令行模式实际上感觉并不是很方便,所以官方描述很少,但你如果感兴趣可以看一下,地址https://avatars.dicebear.com/integrations/cli

3. Serverless部署

这个是基于Cloudflare的Serverless框架的部署。一个免费的账户拥有10w次请求可以使用,是一个不错的选择。如果你对他感兴趣,可以去以下网站https://avatars.dicebear.com/integrations/serverless#installation
如果后面有机会,本人会发布相关的文章。

4. 生成头像的风格

5. 头像生成选项

生成头像有几个可选项,可以指定生成头像的类型,详细请看https://avatars.dicebear.com/docs/options
在这里插入图片描述

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/221652.html原文链接:https://javaforall.net

(0)
上一篇 2026年3月17日 下午5:35
下一篇 2026年3月17日 下午5:36


相关推荐

  • 垂直类AI Agent智能体介绍

    垂直类AI Agent智能体介绍

    2026年3月15日
    2
  • opencv3.3版本训练自己的物体分类器

    opencv3.3版本训练自己的物体分类器Opencv 训练自己分类器注 此文是我整理了网上的各方资料汇集而成 由于在实践中遇到了很多坑 所以把自己的成功训练的经验写下来做个笔记给大家做个参考 本文所使用 opencv 版本为 3 3 下载链接 https opencv org releases page 3 1 准备训练样本图片 1 1 样本的采集 样本图片最好使用灰度图 且最好根据实际情况做一定的预处理 样本数量

    2026年3月19日
    2
  • R、RStudio下载与安装方法

    R、RStudio下载与安装方法现如今,R语言是统计领域广泛使用的工具,是属于GNU系统的一个自由、免费、源代码开放的软件,是用于统计计算和统计绘图的优秀工具。而RStudio是R的集成开发环境,用它进行R编程的学习和实践会更加轻松和方便。下面就教大家如何下载并安装R和RStudio,比较简单。R的维护工作由一个国际化的开发者团队负责。R软件的官方下载页面叫作TheComprehensiveRArchiveNetwor…

    2022年6月30日
    49
  • leavecriticalsection报错_sequence的用法

    leavecriticalsection报错_sequence的用法线程锁的概念函数EnterCriticalSection和LeaveCriticalSection的用法注:使用结构CRITICAL_SECTION需加入头文件#include“afxmt.h”定义一个全局的锁CRITICAL_SECTION的实例和一个静态全局变量CRITICAL_SECTIONcs;//可以理解为锁定一个资源statici

    2026年1月31日
    3
  • Qwen-Turbo-BF16部署教程:Flask+Diffusers环境零配置快速启动指南

    Qwen-Turbo-BF16部署教程:Flask+Diffusers环境零配置快速启动指南

    2026年3月17日
    3
  • java之—冒泡排序

    java之—冒泡排序首先,什么是冒泡排序(BubbleSort)呢?     对未排序的各元素从头到尾依次比较相邻的两个元素大小关系,若大于则交换位置,经过第一轮比较排序后可得出最大值,然后使用同样的方法把剩下的元素逐个比较即可。    假如有N个元素,那么一共要进行N-1轮比较,第M轮要进行N-M次比较。(若6个元素,要进行6-1轮比较,第一轮比较6-1次,第四轮比较6-4次)  pa…

    2022年6月13日
    31

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号