Letterly

A drop-in replacement for ui-avatars.com — generates letter avatars as SVG or PNG, on the edge, via Hono on Cloudflare Workers.

Ada Lovelace avatar
Grace Hopper avatar
Alan Turing avatar
Margaret Hamilton avatar
Katherine Johnson avatar
Linus Torvalds avatar
Barbara Liskov avatar
Dennis Ritchie avatar
Radia Perlman avatar
Guido van Rossum avatar
Hedy Lamarr avatar
Claude Shannon avatar

Usage

GET /api/?name=John+Doe
GET /api/?name=Jane+Doe&background=0D8ABC&color=fff&rounded=true
<img src="/api/?name=John+Doe&size=64" width="64" height="64" />

Parameters

ParamDefaultNotes
nameJohn DoeFull name. Initials are derived from it.
size128Pixels, 16–512.
length2Number of initials, 1–8.
backgroundf0e9e9Hex, no #. Or "random" for a deterministic palette pick per name.
color8b5d5dHex, no #. Or "auto" to contrast against the background.
roundedfalseCircle instead of square.
boldfalseBold initials.
uppercasetrueForce initials to uppercase.
font-size0.5Fraction of size, 0.1–1.
formatauto"svg" or "png". Defaults to the Accept header, else png.
cachetrueSet false to disable the Cache-Control header.

Path-based routing (with Gravatar or similar)

A good use-case for this is a fallback avatar for Gravatar. Gravatar's d= fallback param can't contain a raw &-separated query string, so every setting can also be passed as an ordered path segment instead of a query param:

GET /api/:name/:size/:background/:color/:length/:font-size/:rounded/:uppercase/:bold/:format

All segments after :name are optional and positional — trailing ones can be omitted, but you can't skip one in the middle. URL-encode the name, and use + for spaces (it isn't decoded to a space in a URL path the way it is in a query string, so this route does that translation for you):

GET /api/Jane+Doe/128/0D8ABC/fff

https://www.gravatar.com/avatar/EMAIL_MD5?d=https%3A%2F%2Fyour-domain.com%2Fapi%2F/Jane+Doe/128