dithr

Deterministic dithered avatar generator in TypeScript inspired by Vercel avatars.

• Input: any string (for example a wallet address)
• Output: SVG string
• Style: fixed gradient base + seeded 2-color palette + ordered Bayer dithering

Usage

import { createDithr } from "dithr";

const svg = createDithr("0x742d35cc6634c0532925a3b844bc454e4438f44e", {
  size: 24,
});

Then render svg directly in the DOM or save it as an .svg file.

API

createDithr(input, options?)

• input: string (required, non-empty)
• options.size?: number (default: 32)
• returns: string (SVG markup)

Local Playground

The playground is the root index.html.

Build the library:

npm run build

Start a static server from repo root:

python3 -m http.server 8080

Open: http://localhost:8080/

Development

npm run build
npm run dev
npm run lint
npm run format

Notes

• The package is ESM ("type": "module"), so runtime import paths use .js extensions internally.
• If you change source, rebuild before testing playground or publishing pages:

npm run build