Identicon Js

0 views
Skip to first unread message

Maribeth Seagers

unread,
Aug 3, 2024, 5:27:38 PM8/3/24
to klinsamdintbell

The reversal is obviously is as hard as the hash function used in the particular implementation, if at all possible in case when the identicon representation contains fewer bits than the original data.

The short summary is that Gravatar bases its icon on a MD5 hash of the user's email address, and exposes this MD5 hash publicly. It turns out that it is possible to do boring old offline dictionary search to reverse this MD5 hash, and experiments have shown that this can identify many people's email address if they are using Gravatar.

IdenticonSvg exposes a single generate/4 function that generates the SVG code of the identicon for the specified text argument, optionally with different identicon size, background color, and/or opacity.

New since v0.8.0: Setting bg_color to one of the following 3 atom values sets the color of the background squares to the corresponding RGB-complementary color of the automatically-defined foreground color, with the default (1.0) or requested opacity:

IMHO, too much of the web what we read are textual or numeric information which are not easy to distinguish at a glance when they are jumbled up together. So I think adding visual identifiers will make the user experience much more enjoyable.

I think identicons have many use cases. One use is embedding them in wiki pages to identify authors. Another is using them in CRM to identify customers. I can go on and on. It's not just about IP addresses but information that tends to move in 'herds'.

It's genius. And the simple algorithm Don came up with produces beautiful, unique results. Just scroll through the comments on his blog to see Identicons in action. They work amazingly well, even at 16x16. Jon Galloway and I were inspired. We rolled up our sleeves and ported Don's Identicon code from Java to .NET 2.0.

Identicons aren't just for show. They're quite practical. Rather than printing everyone's IP address next to their comment, you can show their anonymized Identicon. It's more private, it's almost as useful, and it's much more fun. Download the sample and try it yourself.

You can adjust the background and foreground colors, the number of squares in and the size of the identicons in the Identicon Control Panel. You can also clear the Identicon image cache in the control panel.

Hello! LOVE this wonderful plugin! It has been working perfect but I just switched servers and my recent comments are coming in red and white identical identicons that are different than the usual ones. I had tried clearing cache and even tweaking colors but they are not changing. Any ideas what could be the problem? You can see them in this recent post here: -the-new-moon-astral-insights-from-sarah-varcas/
Gratitude for your help!

@spyrius @gummifisch
Thanks for catching that. MySQL made integer overflow an error in their newer versions but I was using that in the randomization code so things stopped getting randomized with new MySQL versions. Should be fixed now.

We want Stack Overflow* users to be able to personalize their questions and answers with a small picture -- even if they've never created an account on our site. Rather than build this functionality ourselves, we've decided to take advantage of Gravatars. Gravatars are small images associated with your email address.

I highly recommend signing up for Gravatar. It's totally painless. Once you do, your image will show up automatically in the comments here, and on any questions or answers you post to Stack Overflow, too. I think you'll be surprised how many places on the web start to associate your Globally Recognized Avatar with the simple entry of your email address in a form. Satisfaction guaranteed, or your money back!

Another neat (and recently added) feature of Gravatars is a fallback. If someone doesn't want to sign up for Gravatar -- and hey, we're totally cool with that, we don't judge -- Gravatar will render an Identicon for them automatically.

What are Identicons? Well, they're a sort of digital fingerprint -- a visual glyph that represents your IP address. Everyone stores IP addresses internally, but it's considered borderline rude on today's web to out someone's IP address when they post content somewhere. The identicon is a way of showing the IP address without showing their IP address. Knowwhatimean?

If you want to be totally anonymous, don't worry. You still are. Or as much as you can be on the web, anyway. You'll still get a unique image (on individual websites; it's hashed per-site) associated with your content in the form of that Identicon -- so we can know it was really you, Mr. Anonymous, and not another anonymous user pretending to be you. Well, assuming you always post from the same IP address, anyway.

If you're interested in implementing Gravatars in your software or website, it's dead easy. Here's the code (yep, actual code! We are actually building this thing, believe it or not!) which renders the Gravatar for us.

Given any identicon and information of whether it was generated from an email or IP address, can the email or IP address be identified? If yes, post my email in a spoiler (I registered an email with my account). If no, provide reasoning why.

It used to be possible, as Gravatar identicons are a graphical representation of the MD5 hash of an encoding (trim leading and trailing whitespace and convert letters to lowercase) of your email or IP address. Both of these things are small enough to make brute force feasible. Nowadays, Gravatar includes a secret salt in the hash operation, making it impossible to even attempt to brute force them without knowledge of that secret. The secret is stored somewhere on the Gravatar servers. If someone was able to obtain that secret, they would be able to brute force the email or IP address.

Believe it or not, I created this simple animation using Happy Wheels. It's obviously not a proper animation tool, but the level editor allows for very simple and easy 2D physics simulations. I simply recreated my identicon using shapes. The levelXML for the level that I created is available at the bottom of the page.

All of the shapes in the level are sleeping at first in order to give time for the camera to move into its resting position. During this time, an invisible ball is falling from the very top of the level area, taking roughly 10 seconds to land on the shapes and trigger the physics.

After recording the animation, I used OpenShot to export the video as an image sequence. Then imported all of those images into GIMP, cropped and adjusted the image and exported as an interpolated GIF.

The GIF was originally a non-looping GIF, however this did not work very well due to browser image caching. Once the GIF had stopped playing, refreshing the page would not cause the browser to replay the GIF from the beginning. Instead, it would just display the final frame of the GIF. In order to combat this, I am now using a non-looping GIF, but the final frame has an extremely long delay. This gives the impression that the GIF has stopped playing, whereas it is really just waiting to display the next frame. If you watch it long enough, the GIF will loop after around 15 minutes.

In order to implement this on my site without using JavaScript or PHP, I used a nifty CSS trick that I found on StackExchange. The trick uses a HTML form checkbox. A different background image is set for each state (checked or unchecked) of the checkbox/label combo, causing the image to change when the checkbox is toggled. This is transparent to the user, since all they can see is a normal image. I ended up changing the checkbox to a single radio button in order to prevent the image from changing multiple times.

For the community member Gravatar should be able to give you an implicit identity, letting you customize it explicitly from there. For the site owner Gravatar should give your site a feeling of community, helping to solidify your hard work by giving your members a face, some semblance of permanence.

Looking around at the existing wordpress plugins for inspiration we found these three exceptional projects: WP_Identicon, WP-MonsterID, and the Wavatars plugin. We decided to take the truly inspiring work that these projects have done, and internalized those ideas into gravatar. Now you will be able to specify a &default= value of wavatar, monsterid, or identicon to produce results like these:

Hi I am so new to this blogging. Are you able to select the monster per profile (the user themselveS) how do you do that? My profile doesnt allow me to change it and I cant find my avatar. Love the drawings though

This sounds like a solution looking for problem. We can customize what the guest/missing icon looks like for years. Or am I missing something? Oh, yes. Transparent support many many people want and use that got pulled.

I thought this was acually pretty cool. so i ended up making a few of them for the different names and usernames that i have for a few of the different places i go. The one i like best is the one of the right, that has the four dots in the centre. This is quite interesting though, that you can have a universal image of your name that can be used anywhere. I think its really rather cool.

One annoying issue in adopting a consistent avatar across many platforms is that some (like the main OGS site) use square avatars, while others (like this Discourse forum) crop avatars to be circular.

What i like to do is make the OGS profile pics in to anime faces and such, like the ones i have now, as if its a responce to a really good move my opponant played, and they look at the profile pic, and that will be my reaction.

I think the real benefit (and main intended use) of identicons is if they are installed as the default avatar generator across a platform. Hence, they serve to generate distinctive, default avatars (that are generic and abstract enough to not offend) for people that have not set a custom avatar.

c80f0f1006
Reply all
Reply to author
Forward
0 new messages