Skip to content
blobz
Add to your app

Open-source SVG avatars

Expressive default avatars for React and shadcn apps.

Generate SVG avatars from user IDs, customize your brand colors, and ship with React components, shadcn blocks, or a hosted API.

Add to your appTry the playground
  • MIT licensed
  • Custom brand colors
  • Free React & shadcn toolkit

Janaki Ammal

Mint palette

From preview to production

Add Blobz to your app.

A React component, source you own with shadcn, or an image URL for any stack. Pick what fits your project.

React and shadcn are free and open source.
No account or API key needed.

react · npm
npm i @blobz/react
your-component.tsx
import { Avatar } from "@blobz/react";

<Avatar
  name={user.id}
  palette={["#eef9ff", "#38bdf8"]}
  size={48}
/>

React 19+ · Renders locally · No global stylesheet

React docs

Made for your interface

Your app.
Your colors.

Drop avatars into profiles, teams, and account menus. Try a palette or bring your own brand colors to see how they fit.

Palette
Palette
Custom
Saksham's Blobz avatar
Profile

Saksham

Designing friendly things for the internet.

248 posts12.8k friends
Social card

Say hello to

Saksham's tiny internet face.

Made to match your palette.1200 × 630
Recent activity

  • Saksham shipped a new profile

  • Kalpana joined the tiny-wins channel

  • Vikram remixed a new palette

Team chat# tiny-wins
Saksham

These colors fit right in.

Message the team

Predictable by design

Stable by default.

Use a stable user ID with the same palette and settings to get the same avatar across sessions and surfaces. Render it on demand, with no uploaded images to store.

Pricing

Pay for the URL,
not the avatar.

Plus

Hosted API

$49.90/ year

A hosted image URL for every user. No file storage needed.

5Mrequests / month
Choose Plus

Pro

Hosted API

$99.90/ year

A hosted image URL for every user. No file storage needed.

10Mrequests / month
Choose Pro

Free toolkit

Free forever

$0

Generate unlimited avatars in your app. No account or image requests.

React packageReady-to-use shadcn components
Start for free

Hosted plans include 5 approved origins and no overage charges.

Back the project

Help keep Blobz open source.

Your support helps keep Blobz open, playful, and growing.

SponsorsYou can be here, with a Blobz beside your name.

A better default, ready to ship

Give your app a little character.

Start with the free React package or add a shadcn component. Make it yours from there.

Add to your app