AV-001 · J. Avatars and Illustrations

DiceBear

Avatar generator with 60+ styles, deterministic from a seed (e.g. a user ID). Use it via the HTTP API, JS library, CLI or Figma plugin. For commercial use or higher limits, self-host the API or use the JS library.

Summary

What it is

An avatar generator or set you can use in product UIs.

Who it’s for

Teams that need placeholder or user avatars with clear licensing.

Monochrome light Split heroFriendly, developer-focused

DiceBear: hero image — Examples: generated by us with the DiceBear API (v10) using CC0 styles only: lorelei, notionists, open-peeps, shapes, thumbs, pixel-art.

Key takeaways

Captured dicebear.com: split hero with “Pick a seed.
Get an avatar.” on the left and a cluster of sample avatars on the right; near-white UI so the avatars carry the color.
Color: monochrome light theme; dominant colors #FAFAF9, #868887 (ESTIMATED from our capture).

Best practices to borrow

Keep chrome neutral and let content carry color.
Put the promise on one side and proof (product, media or illustration) on the other; keep the headline short.
Seed avatars deterministically from a user ID so each person always gets the same one.

ESTIMATED

Palette preview

#FAFAF9~59%#868887~5%

Quick links

Source DESIGN.md Images (.zip)

How to use

HTTP API: https://api.dicebear.com/10.x/lorelei/svg?seed=user-8f3a2c
JS: import { createAvatar } from '@dicebear/core'; import { lorelei } from '@dicebear/collection'; const svg = createAvatar(lorelei, { seed: 'user-8f3a2c' }).toString();

Figures

Example avatars generated by us where the license allows it; see each caption for the style and its license.

Examples: generated by us with the DiceBear API (v10) using CC0 styles only: lorelei, notionists, open-peeps, shapes, thumbs, pixel-art.

Download full resolutionRendered by the research team; see caption for source and license. Entry license: Code: MIT. Styles: each artist’s own license: 42 CC0 1.0, 14 CC BY 4.0, 1 MIT, 4 ‘free for personal and commercial use’ (see dicebear.com/licenses). Public HTTP API: free for non-commercial use, rate-limited

Related entries

WR-004 · Website Reference

ESTIMATED

Dominant palette from our captures

Measured by us from our screenshot(s) of https://www.dicebear.com/ (median-cut quantization; share = % of pixels). Approximate and not official.

#FAFAF9~59% of pixels#868887~5% of pixels

Layout pattern: Split hero

Observed by us on the captured page(s). See all entries by layout.

How to apply it: Put the promise on one side and proof (product, media or illustration) on the other; keep the headline short.

Other entries with this layout: Material Design 3, Heroicons, Phosphor Icons, Linear, Stripe, Notion, Open Peeps, Humaaans, Blush, Linear onboarding flow.

Our analysis

Captured dicebear.com: split hero with “Pick a seed. Get an avatar.” on the left and a cluster of sample avatars on the right; near-white UI so the avatars carry the color.

Monochrome light Split heroFriendly, developer-focused

Similar to this

Ranked by shared color theme, layout, category, type and mood tags.

WR-004 · Website Reference

Notion

Monochrome lightSplit hero

AV-002 · Avatar Style

DiceBear · Lorelei

Monochrome lightDocumentation

AV-005 · Avatar Library

Multiavatar

Monochrome lightCentered hero

IC-002 · Icon Library

Heroicons

Monochrome lightSplit hero

Downloads

All images (.zip) DESIGN.md

License / terms of the source: Code: MIT. Styles: each artist’s own license: 42 CC0 1.0, 14 CC BY 4.0, 1 MIT, 4 ‘free for personal and commercial use’ (see dicebear.com/licenses). Public HTTP API: free for non-commercial use, rate-limited

DESIGN.md for AI coding agents

Copy this into your repo or agent context. OFFICIAL and ESTIMATED values are labelled.

Download .md All entries

# DESIGN.md · DiceBear (AV-001)

> Written for AI coding agents. Values marked **OFFICIAL** come from the documented source named below; values marked **ESTIMATED** were measured by us from our own screenshots and are approximate. Never treat ESTIMATED values as official brand tokens.

## Overview
- Type: Avatar Library · Category: J. Avatars and Illustrations
- Platforms: Web
- Color theme: Monochrome light · Layout pattern: Split hero · Mood: Friendly, developer-focused
- License / terms: Code: MIT. Styles: each artist’s own license: 42 CC0 1.0, 14 CC BY 4.0, 1 MIT, 4 ‘free for personal and commercial use’ (see dicebear.com/licenses). Public HTTP API: free for non-commercial use, rate-limited

Avatar generator with 60+ styles, deterministic from a seed (e.g. a user ID). Use it via the HTTP API, JS library, CLI or Figma plugin. For commercial use or higher limits, self-host the API or use the JS library.

### Analysis (ours)
Captured dicebear.com: split hero with “Pick a seed. Get an avatar.” on the left and a cluster of sample avatars on the right; near-white UI so the avatars carry the color.

## Color tokens
No official color tokens documented for this entry.

ESTIMATED · dominant colors measured from our screenshot(s) of the source site (median-cut quantization; share = % of pixels). Approximate, not official:

- `#FAFAF9` ~59%
- `#868887` ~5%

## Typography
No official type scale documented for this entry; use the product’s own typography guidance.

## Spacing, radii, shadows
Not documented for this entry. Do not invent values; derive from your own design system.

## Components
No component inventory documented for this entry.

## Layout rules
- Observed layout pattern: **Split hero** (from our captures).

## Usage
```
HTTP API: https://api.dicebear.com/10.x/lorelei/svg?seed=user-8f3a2c
JS: import { createAvatar } from '@dicebear/core'; import { lorelei } from '@dicebear/collection'; const svg = createAvatar(lorelei, { seed: 'user-8f3a2c' }).toString();
```

## Do’s and don’ts
- Do: Keep chrome neutral and let content (images, icons, type) carry color.
- Don’t: Don’t introduce decorative color that competes with content.
- Do: follow the source’s license/terms listed above.
- Don’t: present ESTIMATED colors as official tokens.

## Sources
- https://www.dicebear.com/
- Library entry: https://design-library-byt.pages.dev/entry/AV-001