Advertisement
Tech by VICE

This Amazing Image Made of Code Looks Different Based on Your Browser

PureCSS Lace by Diana Smith is the latest portrait made from code, rendered in-browser.

by Samantha Cole
Nov 5 2019, 1:00pm

PureCSS Lace as viewed in Chrome.

This portrait looks different depending on the browser you view it in, because it's not an "image" at all. It's pure web code that your browser renders into a drawing every time you load the page.

PureCSS Lace is the latest of digital artist Diana Smith's code portraits inspired by Flemish baroque oil paintings, joining PureCSS Francine from May 2018. Along with a few retro-inspired posters and a woman in neon-glowing profile, the pieces are created from code, instead of embedded .jpg image files that look the same no matter how you view them.

So, you can't save Lace or Francine—you could screenshot them, but that would ruin what makes them so unique—but you can distort them into some pretty wacky versions of themselves, depending on the browser it's rendered within.

"Because of the artistic nature of this project I have not concerned myself with cross-browser-compatibility, so the live preview will most likely look laughable in anything other than chrome," Smith wrote in the GitHub repository where each of her projects and their source code is stored.

Motherboard loaded Lace up in several different browsers. The results were definitely laughable, yet still weirdly artful.

These are all screenshots of PureCSS Lace rendered in different browsers, so they'll look the same in your browser no matter which you use, while showing off how different browsers transform the work.

Safari, for some reason, renders the lace frills of Lace to the front.

safari

Things get weirder—and more Cubist—in a version of Opera from 2014.

opera

Ironically, Microsoft Edge takes all the edges off.

edge

Netscape Navigator looks like it was created in Microsoft Paint—appropriate, as both ruled the 90s.

nav

“When you look at this image on different browsers, you’re kind of looking at the history of the internet and what was demanded of it at the time," Smith told Motherboard in 2018.

But experimenting with different browsers also reveals a hint of the future: A ton of browsers these days are running Chromium, Google's open-source browser code. Whereas Pure CSS Lace might have shown off how every browser is unique in the past, it now looks exactly the same on Chrome, Vivaldi, Brave, and Opera.

Tagged:
diana smith
purecss