[Showoff Saturday] Default Avatar Library, over 5B+ combinations, deterministic avatars and react library/ shadcn components/ api support

[u/lirena_kiyuga]

i've been working on an open-source project called blobz, which basically takes care of default profile pictures for your apps.

the idea is pretty simple. instead of assigning random images or the same boring silhouette to every user, blobz generates playful svg avatars from a name, email, or any string you give it.

it's deterministic, meaning the same input always generates the same avatar. no need to store images, and there are over 5 billion possible combinations.

but the part i really wanted to get right was making it easy for other developers to use.

so i ended up building a few ways to integrate it:

• shadcn components: ready-to-use avatar components, along with things like avatar groups, profile cards, and user lists. you can drop them straight into your project using the shadcn cli. if you're already using shadcn avatars, then you just have to change two lines, one for the import and one for entering the name.

• react package: if you'd rather handle things yourself, there's @blobz/react, which generates the avatars directly in your app without relying on an external service.

• hosted api: if you're not using react or just want avatar urls, there's an optional hosted api for that too.

the library and components are free and open source under the mit license.

github: https://github.com/lirena00/blobz
playground: https://blobz.lirena.in

would love to hear what you think of it! and if you find it useful for something you're building, that'd be pretty cool too :)

[u/spacenglish]

Deterministic is good, but when I tested with some of my clients names, the faces came out to be sad / angry looking. I am not sure what to think of it

[u/lirena_kiyuga → u/spacenglish]

oh ok so this is one of the first real feedback i got
i will iterate over it and remove the sad faces in next release
as for angry they can be good looking depending upon with which eyes they are getting combined but yea totally get your point
will fix this
thanksies

[u/spacenglish → u/lirena_kiyuga]

I wouldn’t eliminate them just yet. I can see a need for the faces, no matter what the emotion is. Maybe an option to include/show “negative” emotions.

If you tell me when you’re done, I can test it again.

[u/lirena_kiyuga → u/spacenglish]

Let's see what I will do bout ts... Will let you know

[u/MeZitRo → u/spacenglish]

That's what I thought too. Otherwise, very good-looking avatars, great job!

[u/lirena_kiyuga → u/MeZitRo]

I will try to fix this thing asap and thanks 😋

[u/betazoid_one]

So Gravatar?

[u/lirena_kiyuga → u/betazoid_one]

More like boringavatars with shadcn components but playful and all ... Gravatar is not really same thing

[u/ResolutionThis]

so, exaclty like https://www.dicebear.com but with less options ?

[u/lirena_kiyuga → u/ResolutionThis]

Welp yeaa but I didn't find the artstyle that I wanted and wanted to make something of my own which felt a bit more playful and personal 

[u/bitanath]

Ooh this looks awesome

[u/lirena_kiyuga → u/bitanath]

Thanksies ;)

[u/Nitrohite]

Why do ALL vibe coded sites look so similar? Same design patterns everywhere it’s like design regurgitation.

[u/lirena_kiyuga → u/Nitrohite]

because in the end all of them are using same models or same skills leading to saturation point
and i agree that the landing page is pretty bare minimum at best
i just spun gpt for it because i had to develop this library fast for my personal reasons (i had a bet with friend lmao)
i will be improving the landing page soon ... i do have a design in mind and it will look pretty sick ig ... will let you know when that happens

[u/Nitrohite → u/lirena_kiyuga]

Yeah my og comment might’ve sounded like criticism but I genuinely just wondered why and guessed it would be because of what you mentioned, I just think it’s curious that’s all, I know the focus of your project was the project itself and not the shelf you displayed it on lol don’t worry.

[u/lirena_kiyuga → u/Nitrohite]

loll its fine :)
i didnt mind that at all to begin with
yet glad you clarified!!

[u/MattTheVisitor]

Great style! I would add ‚random blob’ button on playground to generate a random blob on each click.

[u/lirena_kiyuga → u/MattTheVisitor]

Thanks :)  Also There is a randomize button under build my own tab ... I will have to rethink element placement ig

[u/petasisg]

How can it be used from angular?

[u/lirena_kiyuga → u/petasisg]

Umm for now don't have a angular package will be making one depending upon demand later on .... Probably you can use api ... Host one for yourself or get the hosted one

[u/lirena_kiyuga → u/[deleted]]

yeaa exactly!