Letterly
Generates letter avatars as SVG, PNG, or JPEG, on the edge, via Hono on Cloudflare Workers.
Usage
GET https://letterly.dev/api/?name=John+Doe
GET https://letterly.dev/api/?name=Jane+Doe&background=0D8ABC&color=fff&rounded=true
<img src="https://letterly.dev/api/?name=John+Doe&size=64" width="64" height="64" />
# As a Gravatar fallback (see below) - shows this avatar when there's no Gravatar for the email
<img src="https://www.gravatar.com/avatar/EMAIL_MD5?d=https%3A%2F%2Fletterly.dev%2Fapi%2F/Jane+Doe/128" />Parameters
| Param | Default | Notes |
|---|---|---|
name | John Doe | Full name. Initials are derived from it. |
size | 128 | Pixels, 16–512. |
length | 2 | Number of initials, 1–8. |
background | f0e9e9 | Hex, no #. Or "random" for a deterministic palette pick per name. |
color | 8b5d5d | Hex, no #. Or "auto" to contrast against the background. |
rounded | false | Circle instead of square. |
bold | false | Bold initials. |
uppercase | true | Force initials to uppercase. |
font-size | 0.5 | Fraction of size, 0.1–1. |
format | auto | "svg", "png", or "jpeg"/"jpg". Defaults to the Accept header (svg or png), else png. |
cache | true | Set 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 https://letterly.dev/api/:name/:size/:background/:color/:length/:font-size/:rounded/:uppercase/:bold/:formatAll 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 https://letterly.dev/api/Jane+Doe/128/0D8ABC/fff
https://www.gravatar.com/avatar/EMAIL_MD5?d=https%3A%2F%2Fletterly.dev%2Fapi%2F/Jane+Doe/128