Unofficial Map: London Underground Map Recreated Entirely in CSS
Even though I’m mainly a print designer, I’ve done enough web design work to know how fiddly (yet also powerful) Cascading Style Sheets (CSS) can be. That’s why I’m totally in awe of this incredibly accurate rendition of the Tube Map, created with nothing but code by John Galatini. Not one image file to be seen! Johnston Sans is recreated with a web font, while the symbols for accessibility, National Rail, ferries, the Emirates Airline, etc. seen on the map are all “drawn” completely with CSS code. John estimates that the project took around 120 hours to complete, and I can believe him!
While the project’s website gives some great technical information on how the map was achieved, I prefer John’s own description on Twitter:
“It’s basically lots of rectangles and squares, lots of border-radius (to create circles) and a shit load of css rotation.”
Our rating: An astounding example of what CSS can do. Five stars!
(Source: CSS Tube website)
(x)
A group of scarabs from the Scarabaeid family, July 1929.
Photograph by Edwin L. Wisherd, National Geographic
polar bear in lupines
by Michael Poliza (more here)
Commission: Earth Structural Layer Cake by ^cakecrumbs
Holy crap, will you look at this thing? Science *and* cake all in one? How can you not be in awe?
(via 4gifs)
