Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

The Simpsons in CSS

pattle.github.io

Post reply on HN
Print view View original

41–50 of 105 posts

Re: The Simpsons in CSS

#41

Post by anonsivalley652 »

Animated even and the code looks hand-drawn. I Fun fact: I worked at a nuclear engineering consultancy in the 90's. That's the not the fun fact. The hostnames of the computers were all Simpsons' character names.

   rsh blinky

   ftp homer

Re: The Simpsons in CSS

#42

Post by Cub3 »

rambojazz wrote: post #27

Seriously, how are these things made? Is there a GIF2CSS converter or anything like that?

When I was a mid level front ender I would manually craft a lot of these for fun, really helps improve your css knowledge

Re: The Simpsons in CSS

#44

Post by ak39 »

Damn, this is dope! (Learnt that from my sons)

Now just give me a design surface tool that takes my raster drawn images and converts it to these CSS and I will be on it like a rash.

Re: The Simpsons in CSS

#48

Post by PopeDotNinja »

anonsivalley652 wrote: post #39
z3t4 wrote: post #15

SVG would be a better fit. Hand written SVG is underrated. But maybe it would not be difficult enough to make them in SVG. Whenever you feel the CSS get a bit hacky, like backgrounds with round shapes, it can usually be solved in a few lines of SVG. SVG also has classes and CSS, yes you can have CSS in SVG for style reusability and abstraction. You can also create SVG on the fly using JavaScript.

"It is not the critic who counts; not the man who points out how the strong man stumbles, or where the doer of deeds could have done them better. The credit belongs to the man who is actually in the arena, whose face is marred by dust and sweat and blood; who strives valiantly; who errs, who comes short again and again, because there is no effort without error and shortcoming; but who does actually strive to do the d…

Barely related... My favorite bathroom sign says "we don't swim in your toilet, don't pee in our pool".

Re: The Simpsons in CSS

#49

Post by rpastuszak »

My first reaction when I saw the title was "oh, not this again", but this looks neat and the CSS source, surprisingly clean!

I really enjoyed the first attempts at 3d in CSS (in pre-canvas, WebGL times). Can't find the right example, but in a nutshell, the approach involved using border-width to create triangles, and thus triangle meshes.

You might like this one: https://keithclark.co.uk/labs/css-fps/desktop/

Re: The Simpsons in CSS

#50

Post by rpastuszak »

peterkelly wrote: post #33
z3t4 wrote: post #15

SVG would be a better fit. Hand written SVG is underrated. But maybe it would not be difficult enough to make them in SVG. Whenever you feel the CSS get a bit hacky, like backgrounds with round shapes, it can usually be solved in a few lines of SVG. SVG also has classes and CSS, yes you can have CSS in SVG for style reusability and abstraction. You can also create SVG on the fly using JavaScript.

I suspect you may be missing the point of this exercise

If everything I did had a practical purpose, I'd die from boredom without learning anything beforehand. Kudos to the poster for sharing this.

Also, if I was hiring a developer with decent CSS knowledge, and found this attached to their CV, it'll help me skip a ton of questions (and I'll be less bored during the interview).

Next step: ensure that the related Simpons characters' images are build using CSS cascade:)

Sidenote: I think we should put more energy in replying to the OP, rather than feeding trolls (I'm up for constructive criticism, but genuinely think that the parent comment doesn't add anything to the discussion).

Post reply on HN