Blobz

Give any name, username, or ID a face that stays the same. Blobz turns a string into a playful SVG avatar. The same input and palette produce the same character, so your app can render it again without storing an image or calling a service.

Try the avatar studio · Read the docs · See the packages

Pick your way in

React: one component

bun add @blobz/react

import { Avatar } from "@blobz/react";

export function ProfileAvatar() {
  return (
    <Avatar
      name="janaki-ammal"
      alt="Janaki's avatar"
      palette={["#f2f1f4", "#7c6cf2"]}
      frame="rounded"
      size={64}
    />
  );
}

Anywhere else: SVG as a string

bun add @blobz/avatar-core

import { createAvatar } from "@blobz/avatar-core";

const { svg, choices } = createAvatar({
  name: "janaki-ammal",
  palette: ["#f2f1f4", "#7c6cf2"],
  frame: "rounded",
});

// svg is the complete image; choices describes the generated face.

The name selects the face. The palette colors it; the frame chooses its crop. Blobz hashes the normalized input into stable feature choices and renders those choices as SVG. There is no random seed to save and no image asset to upload. If you want to pick every feature yourself, use createCustomAvatar or CustomAvatar.

What's in this repo

Dodo Payments handles paid API subscriptions. Varlock validates server configuration; Bun and Turborepo run the workspace. The two avatar libraries work without the web app, database, or billing setup.

Run the site locally

bun install
bun run dev:web

The site runs at http://localhost:3001. The studio and docs are available without an account. Dashboard and hosted API work need the services listed in apps/web/.env.schema; CONTRIBUTING.md has the local setup and checks. The hosted API guide covers image URLs, origin rules, quotas, and billing operations.

License

MIT. See LICENSE. The published packages include their own license copies.