Avatar generator

1. 01Give it a seed

   A name, a username, an email, a user ID — anything stable. The same seed produces the same avatar every time, on any machine, with no lookup and nothing stored.

2. 02Constrain the palette

   Only the hue is seeded. Holding saturation and lightness, and narrowing the hue range, is what keeps a generated set on-brand and stops one avatar coming out unreadable.

3. 03Paste the whole list

   Every avatar in the batch is rendered with its contrast ratio underneath, and anything below 3:1 is ringed in red. This is the check that a hosted generator cannot do, because it never sees the set.

4. 04Take SVG, PNG, or the zip

   SVG for the web, PNG at five sizes, or the whole set zipped with both. Or copy the data URI and skip the file entirely.

Seeded hue with fixed lightness gives even coverage of the colour wheel — and human perception of lightness is not even at all.

hue 240  blue      dark to the eye    white reads well
hue   0  red       mid                white reads well
hue 120  green     bright             white struggles
hue  60  yellow    brightest          white fails

Same lightness value, four very different luminances.

HSL lightness is a coordinate, not a measure of how bright a colour looks — a yellow at 45% lightness is far brighter to the eye than a blue at the same value. So a set generated across the full hue wheel at one lightness will contain avatars that fail contrast, and always the same hues. Automatic foreground selection fixes most of it by flipping to black where white fails; narrowing the hue range away from yellows and greens fixes the rest.

The four are not interchangeable — they carry different amounts of identity.

• A team or contact list

  Initials

  Letters are the strongest cue when the reader already knows the names in the list.

• Anonymous or pseudonymous users

  Identicon

  A distinct pattern per seed without implying a real name behind it.

• A seed that is an ID, not a name

  Identicon or rings

  Initials taken from a UUID are meaningless. A pattern carries the same distinctness without the pretence.

• Decorative tiles with no identity role

  Gradient

  Pleasant and distinct, but a reader cannot tell two apart at a glance — do not use it to identify people.

• A seed users can change freely

  Any, with care

  The avatar changes when the seed does. Seed from a stable ID rather than a display name if that would surprise people.

• Where a real photo exists

  Use the photo

  These are placeholders. Fall back to a generated avatar only when there is nothing to show.

Hashing

FNV-1a into Mulberry32A seeded generator rather than Math.random, which is what makes the same seed reproduce the same avatar anywhere.

What is seeded

Hue onlySaturation and lightness are held at the values you set, so the set stays consistent and readable.

Contrast floor

3:1WCAG's minimum for large text, which is what an initial at avatar size is. Anything below is ringed in red.

Initials

First and last wordTwo words give two letters; one word gives one, because two letters from one word reads as a false acronym.

Identicon grid

5 × 5, mirroredThree seeded columns mirrored to five, giving several thousand patterns before colour is applied.

Export

SVG · PNG at 5 sizes · zip32 to 512 pixels. The batch zip carries both formats, named from each seed.

Avatars are computed from the seed in your browser. Names, user IDs, and email addresses pasted here are never uploaded — which is the point, given that a hosted avatar service sees every one of them.