44 ms·
Show HN: HN Avatars in 357 bytes
Paste the following into the console of any HN page - for annotated avatars on all HN comments. (self contained code)
for(u of document.querySelectorAll('.hnuser'))for(u.prepend(c=document.createElement('canvas')),x=c.getContext('2d'),c.width=18,c.height=14,s=u.innerText,r=1,i=28+s.length;i--;i<28?r>>>29>X*X/3+Y/2&&x.fillRect(6+2*X,2*Y,2,2)&x.fillRect(6-2*X,2*Y,2,2):r+=s.charCodeAt(i-28,x.fillStyle='#'+(r>>8&0xFFFFFF).toString(16)))r^=r<<13,r^=r>>>17,r^=r<<5,X=i&3,Y=i>>2
- mark_mcnally_je 5y agotesting!
- deleted 5y ago[deleted]
- mxuribe 5y agoThis is cute!
- deleted 5y ago[deleted]
- hutzlibu 5y agoI like it! Btw. if you have browser extension installed, that add custom scripts to websites, like greasemonkey or tampermonkey - you can have those nice avatars all the time. (without opening up the console)
- tomxor 5y agoThis was inspired by @frncsdrk's submission from earlier today [0]. The generative concepts used were inspired by and derived from dweets from @KilledByAPixel and @FireFly [1] [2] [3] The concept is to use HN usernames as the seed into a deterministic avatar generator. This generator is built from the famously simple xorshift32 PRNG, which both provides a random variable for the image generator steps, and "pseudo-hashes" the seed string to provide the initial PRNG state using a non-linear step (adding each codepoint - which is likely not very robust against collisions compared to proper hashing algorithms, but is simple and good enough). The image generation part is a probability distribution with mirrored pixels... specifically: r>>>29 > X*X/3+Y/2 where the left side is 3 of the upper bits of the PRNG state (providing a random integer 0-7), and the right side is the squared distance from the centre for X + the linear distance from the top for Y. i.e the further from the top centre the pixel is, the less likely it will be filled, but linearly for Y and squared for X. Un-golfed version: for (const u of document.querySelectorAll('.hnuser')) { const p=2; const c=document.createElement('canvas'); const x=c.getContext('2d'); c.width=p*7, c.height=p*7; u.parentElement.prepend(c); for (let s=u.innerText, r=1, i=28+s.length; i--;) { // xorshift32 r^=r<<13, r^=r>>>17, r^=r<<5; const X=i&3, Y=i>>2; if (i >= 28) { // seed state r+=s.charCodeAt(i-28); x.fillStyle='#'+(r>>8&0xFFFFFF) .toString(16).padStart(0, 6); } else { // draw pixel if (r>>>29 > X*X/3+Y/2) x.fillRect(p*3+p*X, p*Y, p, p), x.fillRect(p*3-p*X, p*Y, p, p); } } } Was fun to play with, but also surprisingly helpful in following discussions. It's worth mentioning these were heavily inspired by three particular dweets by @KilledByAPixel and @FireFly: [1] https://www.dwitter.net/d/3078 https://www.dwitter.net/d/3078 [2] https://www.dwitter.net/d/19786 https://www.dwitter.net/d/19786 [3] https://www.dwitter.net/d/23326 https://www.dwitter.net/d/23326 [0] https://news.ycombinator.com/item?id=30660316 https://news.ycombinator.com/item?id=30660316
- Lorin 5y agoI've been following Frank Force (KilledByAPixel) for quite some time now, he's on the forefront of generative design via HTML canvas.
- tomxor 5y agoYeah! he's done a deep dive into it more recently. Attempting to follow his twitter thread at the moment is like trying to consume a fire-hydrant of generative art :D hard to keep up, but looks amazing.
- usrme 5y agoThere's actually a slight difference between the golfed and un-golfed version: the un-golfed adds the avatar to the beginning of the line with the username, whereas the golfed version adds it right next to the username. I actually find it to be more visually appealing at the beginning of the line, so I'm sticking with that in my Greasemonkey script. To anyone interested, I've added links to how the un-golfed version looks with Dark Reader enabled[1] and how it looks without Dark Reader[2]. To clarify, I've set my zoom level for Hacker News to 150% as I find the default to not be conducive to reading. --- [1]: https://i.imgur.com/hw9pn0l.png https://i.imgur.com/hw9pn0l.png [2]: https://i.imgur.com/z3jV2NZ.png https://i.imgur.com/z3jV2NZ.png
- tomxor 5y agoYup, i noticed an opportunity to make it smaller while golfing. There is one advantage of the golfed version, which is that it will also inject avatars wherever it finds the .hnuser class, including on other pages.
- chrisdsaldivar 5y agoI've never heard of dweets/dwitter before; thanks for sharing. For anyone else: Dwitter.net is a challenge to see what awesomeness you can create when limited to only 140 characters of javascript and a canvas. Give it a go! https://www.dwitter.net/ https://www.dwitter.net/
- 5y ago
- SCUSKU 5y agoWow this is really great! Noob question, but let's say I wanted to permanently load this JS in my browser? How would I achieve that? Grease monkey? Extension? Thanks :)
- freeCandy 5y agoShould be really easy with grease monkey. I simply pasted the snippet into a new script and enabled it for this site. Works perfectly out of the box.
- benatkin 5y agoThere's a Wikipedia page greasemonkey-like things: https://en.wikipedia.org/wiki/Userscript_manager https://en.wikipedia.org/wiki/Userscript_manager Might try this one: https://chrome.google.com/webstore/detail/violentmonkey/jinjaccalgkegednnccohejagnlnfdag https://chrome.google.com/webstore/detail/violentmonkey/jinj... I just installed it and it seems to work well.
- throwamon 5y agoViolentmonkey is a nice open source alternative to Greasemonkey.
- chrismorgan 5y agoYour wording implies Greasemonkey is not open source. I don’t know if that was your intention or not, but Greasemonkey is open source.
- a_t48 5y agoIt would be neat if the code also applied to the username in the top right so I didn't have to make a spammy comment to see what it gives me. ;)
- senectus1 5y agohuh. is this something we can control?
- dj_mc_merlin 5y agoIn a way, yes. But from the way you phrased it, it sounds like you believe it is a HN feature, which it isn't. It's javascript running in your browser that dynamically generates the avatar via canvas2d and adds it wherever it finds the .hnuser class.
- senectus1 5y agoahh I see. Thank you.
- daenz 5y agoI wonder how easily you could have slipped in an obfuscated cookie stealer
- schleck8 5y agoUTF-encode the maliscious snippet and disguise it as the regex pattern haha
- stavros 5y agoDoesn't UTF-8 just give you the exact same letters, since it's already ASCII?
- kroltan 5y agoI think it was meant to be UTF-8 escape codes, as in \u0000 etc.
- stavros 5y agoAhh that makes sense, thanks.
- tialaramex 5y agoPedantry: These are really Unicode escape codes not UTF-8 escape codes, since they're codes for Unicode code points. You can write invalid UTF-16 with these escapes (because unlike UTF-8 the UTF-16 encoding actually borrows Unicode code points that are not scalar values, called the "surrogates") but I don't know what the standard says should happen if you do that.
- zeusly 5y agoHN sets one cookie and that is "httpOnly" and "secure", so it can't be read from JavaScript. You can test this yourself by typing document.cookie into your console, it should return an empty string.
- usrbinbash 5y ago
- deleted 5y ago[deleted]
- bigpeopleareold 5y agoThis is interesting :D Setting it as javascript:<code>;void(0); can make it useful as a boomarklet :)
- chrismorgan 5y agoPoint of information: the ;void(0); isn’t necessary here because the code ends in a for loop, which produces undefined. (For anyone who doesn’t know about the meaning of void in JavaScript: it’s a unary operator that ignores its operand and produces undefined. What is commonly spelled `void(0)` is briefer as `void 0`. Why don’t people just write `undefined`? For some, because it’s shorter, but mostly for historical reasons: `undefined` is a global property rather than a keyword, and until ES5 (a decade ago), that global property was writeable, so you couldn’t rely on its value because people might do crazy things. And if you’re wondering why a javascript: URL needs to produce exactly the value undefined: if it doesn’t, the browser will convert the value to a string and replace the page with that, loaded as HTML, as demonstrated by this (paste it in your address bar, you can’t click on data: URLs directly for security reasons): data:text/html;charset=utf-8,<a href="javascript:'<h1>Here is a page.'">α</a> <a href="javascript:({toString(){return '<h1>See, stringification!'}})">β</a> <a href="javascript:/*even*/null/*gets stringified*/">γ</a> <a href="javascript:undefined">δ</a> .)
- bigpeopleareold 5y agoIt wasn't actually working for me; it was returning 0 actually. But yeah, this is a good point as well. :D
- chrismorgan 5y agoHuh, turns out my understanding of how it worked was wrong: in things like for loops, it takes the last value encountered. I should have anticipated that, really, given that “last expression” isn’t generally a thing in JavaScript anyway (it’s statement-oriented, not expression-oriented), so javascript: URIs (and I guess on* event handler attributes too, I know they’re a bit weird too) were clearly doing something clever and not-usual-JavaScript. I should delve into specs until I can find it; it seems like it’s at least mildly expression-oriented in character. I retract the first paragraph of my earlier comment with an apology.
- chrismorgan 5y agoFor better rendering on high-DPI screens and (more subjectively) screens of people that have zoomed in because HN’s text sizes are unreasonably small, add c.style.imageRendering='pixelated'. I was going to say that the insertion of these 24 bytes allows you to save ten bytes elsewhere by halving the size of the image (making features one pixel in size, rather than two), but then you’d also have to set the doubled image dimensions, and that’d cost more than ten bytes. (Me, I use HN at 120% on top of a native scaling factor of 150%, which is currently implemented as downsampling of 200% rendering because Firefox hasn’t got fractional scaling right yet under Wayland, and widget.wayland.fractional_buffer_scale has some fairly debilitating side-effects on popup windows including non-rendering and crashes, which is a pity because it improves rendering so very much.)
- tomxor 5y agoIt's a good point, I did consider using that feature but the problem is it's not very cross browser friendly, so I stuck with simpler DIY pixel scaling. In fairness I think there is basically two different values for chrome and firefox, although I'm not sure about safari and cannot test it...
- chrismorgan 5y agoFirefox shipped the value "pixelated" five months ago, so you don’t need to worry about a "crisp-edges" fallback any more. Safari, back in 2016. https://caniuse.com/css-crisp-edges https://caniuse.com/css-crisp-edges This is valuable for high-DPI and zoomed pages, to avoid bilinear or similar scaling; the matter of halving the canvas size was a red herring.
- tomxor 5y agoAh, good to know it's finally normalised.
- deleted 5y ago[deleted]
- thih9 5y agoIs there a screenshot of that in action for mobile users?
- edgartaor 5y agohttps://i.imgur.com/dffcVQ3.png https://i.imgur.com/dffcVQ3.png
- deleted 5y ago[deleted]
- supermatt 5y agoIve been a dev for over 2 decades but I still cant grok bitwise operators - anyone have a reference that may help with that?
- c0balt 5y agoI've found the python docs[0] to be quite helpful for this topic. [0]: https://wiki.python.org/moin/BitwiseOperators https://wiki.python.org/moin/BitwiseOperators
- supermatt 5y agoThanks, but its still a bit confusing for me. Im looking for a really dumbed down kind of approach: input, operator, visual explanation of what its doing, output. Im a really bad learner, and didnt study computer science or anything. Ive never had a reason to touch binary, so find these operators unintuitive.
- stavros 5y agoIf you don't know about the binary representation, you won't be able to learn binary operators. If you do, they're fairly straightforward. I'd suggest learning about binary first.
- bspammer 5y agoI think before you can understand binary operators, you’ll need to understand binary itself and how to convert it to and from decimal. This crash course computer science video may help: https://youtu.be/1GSjbWt0c9M https://youtu.be/1GSjbWt0c9M In fact the whole course might be useful!
- supermatt 5y agoI understand the conversion and representation - i guess I just dont understand the intent behind the usage of these operators. Without stepping through each line in a debugger I literally have no idea what the ungolfed version of the main post is doing, or why its doing it - and this seems to be typical of my experience with bitwise operators. But I will definitely have a look at the references you have given. Hopefully that will give me a more intuitive understanding. Thanks.
- deleted 5y ago[deleted]
- onion2k 5y agoThis is fun. One suggestion.. rather than creating a canvas for each user using a querySelectorAll and a loop, I'd use an IntersectionObserver and only create the canvases as they scroll into view. That way the user's device won't need to create hundreds of elements when the code runs. let observer = new IntersectionObserver( (entries) => { entries.forEach((entry, i) => { if (entry.isIntersecting) { const p = 2; const c = document.createElement('canvas'); const x = c.getContext('2d'); c.width = 18; c.height = 14; const s = entry.target.innerText; const r = 1; if (s) { for ( let s = entry.target.innerText, r = 1, i = 28 + s.length; i--; ) { // xorshift32 (r ^= r << 13), (r ^= r >>> 17), (r ^= r << 5); const X = i & 3, Y = i >> 2; if (i >= 28) { // seed state r += s.charCodeAt(i - 28); x.fillStyle = '#' + ((r >> 8) & 0xffffff).toString(16).padStart(0, 6); } else { // draw pixel if (r >>> 29 > (X * X) / 3 + Y / 2) x.fillRect(p * 3 + p * X, p * Y, p, p), x.fillRect(p * 3 - p * X, p * Y, p, p); } } } entry.target.prepend(c); } else { if (entry.target.firstChild.tagName === 'CANVAS') entry.target.firstChild.remove(); } }); }, { rootMargin: '0px 0px 0px 0px' } ); document.querySelectorAll('.hnuser').forEach((user) => { observer.observe(user); });
- joeraut 5y agoA nice improvement! An unfortunate side-effect of it is that it introduces some jitter during macOS's smooth scrolling in Firefox at time of first render, though.
- deleted 5y ago[deleted]
- Farow 5y agoDoes the canvas need to be created and removed as it comes in and out of view? Using requestAnimationFrame() might also further improve responsiveness.
- unglaublich 5y agoAn unkown person asks you to inject code in your browser. Sorry folks, but this should be a red flag for all of you. I guess you all know enough about obfuscation to know that what you think the code does is not always what the code does. "But it has upvotes!" For all you know, the script could upvote this post.
- nness 5y agoEven when obfuscated, the code looked safe to me. (But I did wonder, and thankfully, HN has set httpOnly on the cookies.)
- hawski 5y agoIt is very short and quite easy to see that it is safe, even if you do not fully grok what is going to happen. If you don't, then by all means do not run it.
- MichaelBurge 5y agoIt's running in a sandboxed environment(the web browser). The worst-case scenario is it gaining access to my HN account, and I don't really care that much about it. It's not going to install a bootsector virus on my machine, or ransomware-encrypt all the data on my NAS. So the risk of anything important happening is small, and the same risk as visiting any website on the internet.
- santialbo 5y agoI've got a pooping person hm
- rbanffy 5y agoI didn't see it as that until you mentioned it.
- zagrebian 5y agoYou got a piranha plant.
- mft_ 5y ago...and I have... um... an octopus carrying a block of wood?
- deleted 5y ago[deleted]
- evan_ 5y agoit's a single eye, squinting, either in concentration or distrust
- nannal 5y agoI think you have a storm trooper.
- davidbarker 5y agoYou have some very intense eyes.
- snek_case 5y agoYeah I thought it was a tribal ritual man sort of thing... but now that you mention it...
- Normille 5y ago
- lcnmrn 5y agoWhat would be the Python, server-side version of it?
- INTPenis 5y agoHah! I got a really cool little icon that looks almost like the cassette tape pirate logo of Piratbyrån back in the day. I have old t-shirts with that logo. MAKE. THIS. PERMANENT! On the functional side, this really helps you see who is who in a long threaded discussion. Your eye is much quicker at following the little color icons than their names.
- Bayart 5y agoThis is awesome and an excellent way to start my day, thank you !
- fennecfoxy 5y agoOoooh what will I get Edit: hmmm, kinda looks like a Tori gate.
- lekevicius 5y agoLooks way better if you add style="image-rendering: pixelated;" to the canvas. Crisp edges on every display.
- vihren 5y agoYup, definitely second that. With that change I can definitely imagine this as a user option in the settings. Reading is so much easier. (also wanted to see my avatar)
- toqy 5y agoIt does! Here's a bookmarklet with that added (generated here: https://caiorss.github.io/bookmarklet-maker/ https://caiorss.github.io/bookmarklet-maker/) javascript:(function()%7Bfor(u%20of%20document.querySelectorAll('.hnuser'))for(u.prepend(c%3Ddocument.createElement('canvas'))%2Cx%3Dc.getContext('2d')%2Cc.width%3D18%2Cc.height%3D14%2Cc.style.imageRendering%3D%22pixelated%22%2Cs%3Du.innerText%2Cr%3D1%2Ci%3D28%2Bs.length%3Bi--%3Bi%3C28%3Fr%3E%3E%3E29%3EXX%2F3%2BY%2F2%26%26x.fillRect(6%2B2X%2C2Y%2C2%2C2)%26x.fillRect(6-2X%2C2*Y%2C2%2C2)%3Ar%2B%3Ds.charCodeAt(i-28%2Cx.fillStyle%3D'%23'%2B(r%3E%3E8%260xFFFFFF).toString(16)))r%5E%3Dr%3C%3C13%2Cr%5E%3Dr%3E%3E%3E17%2Cr%5E%3Dr%3C%3C5%2CX%3Di%263%2CY%3Di%3E%3E2%7D)()%3B
- jx47 5y agoThat's a neat little snippet. Thank you for sharing it. :)
- nojs 5y agoHow can I try this on mobile?
- tyingq 5y agoMake it a "bookmarklet" maybe? https://gist.github.com/caseywatts/c0cec1f89ccdb8b469b1 https://gist.github.com/caseywatts/c0cec1f89ccdb8b469b1
- zerof1l 5y agoThis is cool. Should totally be part of official HN js
- WithinReason 5y agoShould be an unlockable feature after 100 karma through a checkbox in your profile
- mettamage 5y agoFun showcase, but truthfully I would not want this to become a permanent feature. A browser plugin would work.
- AussieWog93 5y agoThis is actually a really useful feature. Makes it easy to see at a glance who is interacting with whom in a thread.
- martneumann 5y agoLove this. Posting to see what I got.
- d--b 5y agoWhat's mine?
- alainchabat 5y agoReply here if you just want to see how your username looks like, so we avoid noise and keep that Show HN on the top. comments are really interesting
- orang2tang 5y agotest
- balivandi 5y agowhat is this - a spaceship?
- CrzyLngPwd 5y agoI hope mine is a spirit animal :-)
- nini1294 5y agotest post please ignore
- max23_ 5y agoLet's see what I got Edit: aha, helicopter
- jitbit 5y agoWow, what the...
- imnitishng 5y agoI'm guessing mine is orange in color!!
- imnitishng 5y agoF
- biztos 5y agoMine will be the orange one because I look good in orange. [Edit: F!]
- Rucadi 5y agoCool! Just commenting to see what I've got xD
- Rucadi 5y agoA lobster!
- addandsubtract 5y agoI see a bull in a suit.
- deleted 5y ago[deleted]
- lexicality 5y agoThese are very cute, but I'm mildly annoyed that mine is basically invisible
- XzAeRosho 5y agoThat sucks. I was thinking of ways to prevent that, but without adding a bunch of ifs it kind of kills the minimalistic approach of the original code.
- snek_case 5y agoYou can have an outer loop that checks how many pixels are set in the avatar and keeps trying to generate a new avatar with a different seed until it's not (rejection sampling). As long as the probability of the avatar being too empty is small it should be fast.
- yoz-y 5y agoThe main problem is probably the color, maybe somehow capping the maximum brightness would be doable.
- davidkuhta 5y agoIt's all about perspective... literally; You're just a dark mode deity. https://darkhn.herokuapp.com/item?id=30668137 https://darkhn.herokuapp.com/item?id=30668137]
- xoxxala 5y agoYou do stand out now!
- riidom 5y agoactually your avatar looks like a mildly annoyed raccoon!
- helb 5y agolooks a bit like old Prague Metro logo, cool https://commons.wikimedia.org/wiki/File:Praha,_Masarykovo_n%C3%A1dra%C5%BE%C3%AD,_star%C3%BD_znak_metra.jpg https://commons.wikimedia.org/wiki/File:Praha,_Masarykovo_n%...
- _squared_ 5y agolove my little alien.
- saberience 5y agohmmm
- rosmax_1337 5y agoCute, but I don't think it really adds much to the site. The content of the comment is much more important to me than whoever posted it. In a way, even the usernames are superflous.
- INTPenis 5y agoTry looking at one of the threads in this post, I'm struck by how much easier it is to follow a discussion at a glance. You see pink avatar talking to green, pink, green, oh here comes orange. You immediately know someone new jumped in with new info. Also yours kinda looks like a portrait of a middle aged 8bit character. Edit: Gotta admit though, on the front page it looks kinda goofy.
- krenel 5y agoFor me the use case is: someone leaves a comment that's ambiguous, someone asks for clarification, some people respond _what they think that original commenter meant_, finally originally commenter solves the doubt. I find myself Control+F the name of the original commenter to see if he/she has replied, because I'm interested in _that_ response — not so much of the interpretation of others.
- tomxor 5y ago> The content of the comment is much more important to me than whoever posted it I agree with this sentiment. I mostly did this for fun, however I will point out that occasionally people get mixed up about who they are responding to with regard to which comments in a thread came from which author, and a random avatar can help to prevent those mistakes.
- gherdty 5y agoGot me to post for the first time just to see my guy.
- pacoverdi 5y agoYou could have stayed in stealth mode by just going to your profile page ;)
- pratio 5y agoThis is really cool
- fbanon 5y agoCool!
- jvzr 5y agoI have opened a merge request on Refined Hacker News (https://github.com/plibither8/refined-hacker-news https://github.com/plibither8/refined-hacker-news) which is a pretty great HN extension for Firefox and other browsers. Thank you to OP Edit: I'm pretty pleased with my blue Space Invader!
- nchudleigh 5y agoHaha this is awesome, rolling... Looks like a Funnel or Chat bubble with the letter V in it.
- wigster 5y agogot to see my avatar!
- wigster 5y agonow we need the backwards version, draw your icon, get your name
- Archer6621 5y agoPretty damn cool, would be a nice feature :D EDIT: Mine looks like some tentacle-headed creature
- ethor 5y agoVery cool, thank you for this!
- nukst 5y agoMy sense of wonder is back! Please make this permanent.
- cridenour 5y agoMine is barely visible so the colors may need some work, but I love the simplicity of it.
- deleted 5y ago[deleted]
- deleted 5y ago[deleted]
- deleted 5y ago[deleted]
- Thonn 5y agoThis is real neat. Wanna see what mine looks like
- kizer 5y agoAs others mentioned, you could add to the plethora of HN browser extensions. Another idea would be to allow people to specify an avatar in their bio and load it in, though that would entail a lot of web requests I guess. Also, I just realized that it's not random... wow!
- kizer 5y agoVery, very nice from a code golf perspective though.
- rcarmo 5y agoI would _love_ to have this (as well as dark mode and a few CSS tweaks for better line wrapping) baked in to the main site, as 2020-era options.
- deleted 5y ago[deleted]
- deleted 5y ago[deleted]
- daemoens 5y agoQuite nice. Wish mine was a bit more visible though.
- pingeroo 5y agocool
- ZoomZoomZoom 5y agoWouldn't it be nice to generate the colour in HSL and/or clamp/normalise the luminosity so it's always darker than the background and prevent "invisible" avatars, such as the one generated for @lexicality?
- some_random 5y agoThis is awesome hahaha
- Ftuuky 5y agoMine looks like an ovary, neat idea tho!
- throwthere 5y agoHow do I buy the NFT?
- cooze 5y agoThis is so cool!
- deleted 5y ago[deleted]
- maebert 5y agoReading the comments, this feels like a giant Rorschach test for HN...
- wgx 5y agoMine is a skull with a top hat, so naturally I demand that this is made permanent. ;)
- deleted 5y ago[deleted]
- adelarsq 5y agoThis is cool! Turn this default please!
- nautilus50 5y agoCool! Works on mobile, too. Prepend "javascript:" to the code and enter on search bar.
- Normille 5y agoNot working for me on mobile. I tried both the extension and the greasemonkey script ???
- gnarbarian 5y agotest. to view my avatar
- red_skull_qc__ 5y agoPeople could carefully choose their username to match a desired avatar! It could be a fun coding challenge to try to generate usernames which match a relevant avatar ;)
- tantalor 5y agotest
- patatino 5y agotest
- hmdai 5y agoBrilliant!
- nwsm 5y agogentle reminder not to paste internet code into your browser console
- oktwtf 5y agoFirefox made me copy and paste "allow pasting" to allow pasting in the console.
- deleted 5y ago[deleted]
- zicxor 5y agoI made a chrome extension of this! So it won't disappear when you refresh the page: https://github.com/ekofi/hn_avatar_ext/ https://github.com/ekofi/hn_avatar_ext/
- mtz_federico 5y agoLooks very cool
- deleted 5y ago[deleted]
- Trixter 5y agoThis is a class of "sprite" generators, which I find fascinating. This one in particular seems very good, although I wonder how much of that is our brains* filling in context. *I am, evidently, a mushroom cloud
- yur3i__ 5y agoalso testing mine
- jart 5y agoGenius. I hope this whole "foo in bar bytes" thing catches on!
- johnnyRose 5y agoThis is neat! Commenting to see my own.
- Hanschri 5y agoVery cool, thanks for sharing!
- Pr0ject217 5y agoTest
- Pr0ject217 5y agoThis is really cool! I've coded in JS for years, and I don't understand how these bit-shifting operations become pixel avatars, or what the magic numbers represent and why they were chosen. I would like to understand how the author thinks. :)
- al3n 5y agowhat is my avatar
- al3n 5y agochecking my avatar
- alickz 5y agocool
- b__d 5y agotest
- cheza 5y agoI want to see my avatar.
- polyterative 5y agothis is so cool
- throwaway5486nv 5y agomy icon check
- throwaway5486nv 5y agoHow did you get this idea?
- ElectronCharge 5y agoMust…check…avatar!
- Graffur 5y agoHow does this work?
- ahmed_ds 5y agoI wonder what mine looks like.
- gbrits 5y agocheck 12
- TommyDANGerous 5y agoThat is pretty cool.
- NoInkling 5y agoTest
- pyxelr 5y agoLet's give it a try! EDIT: A purple girl with braids :)
- IA21 5y agocool
- zhichu 5y agoThat is awesome, wow!
- deleted 5y ago[deleted]
- deleted 5y ago[deleted]