# blobatar

> Deterministic geometric blob avatar generator with zero dependencies.

blobatar is a lightweight open-source library that turns any string or username into a consistent geometric blob avatar. It requires no image storage or external assets, rendering directly in the browser with accessible color contrast and optional animations.

Website: https://blobatar.dev/

## What it is for

- Generate consistent default user avatars without saving image files to storage
- Replace generic initial-based or placeholder profile pictures in React apps
- Add interactive animated avatars using Shadcn UI or standard React components

## Features

- Deterministic rendering where the same string always yields the identical avatar
- Tiny footprint around 4.4 KB gzipped with zero external dependencies
- 10 different silhouettes with guaranteed 4.5:1 accessible color contrast
- Optional hover animations via motion.css or static single \<img\> rendering
- Installable via npm, pnpm, bun, or the Shadcn CLI registry
- Interactive online editor for customizing and previewing traits

## Pricing

Open source. Free and open source (MIT license)

## Details

- Type: GitHub repo
- Category: [Development](https://xiry.app/topics/development.md)
- Topic: [UI Components](https://xiry.app/topics/development/ui-components.md)
- Open source: yes
- Platforms: Code library, Web
- For: Front-end and full-stack web developers building user profiles and comment threads.
- Alternative to: Boring Avatars, DiceBear, Gravatar
- Tags: avatars, react, svg, ui, shadcn, open source

## Why it was saved

- [@vibecodeshub, 18 September 2026](https://www.instagram.com/reel/Ddbf0vwNqpz/): Eliminates the need for fake profile pictures, placeholder images, or avatar file storage by deterministically generating consistent SVG/React avatars on the fly (~4.4 KB, zero dependencies).

## Related

- [shadcn/ui](https://xiry.app/resources/shadcn-ui-1902): Copy-paste React UI components built with Tailwind CSS and Radix primitives. (Website, Open source)
- [Efferd](https://xiry.app/resources/efferd): Pre-built, responsive shadcn/ui blocks and layouts for React applications (Web app, Freemium)
- [Motion](https://xiry.app/resources/motion): Open-source animation library for React, Vue, and vanilla JavaScript (Website, Freemium)
- [React Bits](https://xiry.app/resources/react-bits): Open-source animated and interactive React UI components and backgrounds (Website, Freemium)
- [21st.dev](https://xiry.app/resources/21st-dev): Curated directory of crafted React, Tailwind, and shadcn UI components. (Website, Freemium)
- [lucide-animated](https://xiry.app/resources/lucide-animated): Open-source animated React icons built with Lucide and Motion (Web app, Open source)

Updated 3 October 2026. Page: https://xiry.app/resources/blobatar

Make your own library: Xiry takes your saved reels, tweets, Reddit bookmarks and Watch Later videos, makes them searchable and pulls the useful stuff out, like this library. It's invite-only for now; join the waitlist at https://xiry.app/#waitlist.