UI engineer diana smith creates baroque-inspired portraits using HTML and CSS. using these two hypertext markup languages — jargon for the coding that makes up what you see displayed on web browsers — smith creates every single element by hand.
image courtesy of @modestmeows
smith‘s portraits, titled ‘pure CSS francine‘ and ‘pure CSS lace‘, are not images that can be saved to file but pure code created without libraries, shortcuts, or the use of another visual editor. that means that the portraits can look very different when viewed in different browsers – because of the different code-reading capabilities of each program.
loaded in firefox
image courtesy of @triptych
creating images with CSS involves writing code that will display an object in a browser and then manipulate its various properties, like size or color for example. what makes smith’s process so painstakingly time-consuming is that you can’t see what you are making, which means smith has to use trial-and-error.
image courtesy of diana smith
the portrait titled ‘pure CSS lace’, which features a woman wearing a black dress complete with pearls and a lace colla, is made up of 1,968 lines of CSS code. a piece like this can take smith up to two weeks to create. the outcome is a pure CSS image made up of code that can be endlessly tweaked.
in an old version of opera
image courtesy of @dz
project info
designer: diana smith
title: pure CSS lace / pure CSS francine
portraits (136 articles)
chokoon builds portraits of thai monarchs using only characters from their names
photographer hal vacuum-seals families together with their homes
andreas franke exhibits 24 portraits under the sea to raise awareness of plastic pollution
technology news
volkswagen gives classic 1972 type 2 microbus an electric upgrade
#technology
the electrified VW shows the potential of an E-golf powertrain in vintage vehicles, taken from a 2017 model.
the electrified VW shows the potential of an E-golf powertrain in vintage vehicles, taken from a 2017 model.
designboom test drives bentley's new mulsanne during crewe factory tour in england
#technology
the new mulsanne editions combine state-of-the-art technologies with the handcrafted luxuriousness that is synonymous with the brand.
the new mulsanne editions combine state-of-the-art technologies with the handcrafted luxuriousness that is synonymous with the brand.
tesla's bulletproof cybertruck comes with pop-up camper configuration
#technology
the highly-anticipated battery-powered cybertruck features a cold-rolled stainless-steel skin and armored glass.
the highly-anticipated battery-powered cybertruck features a cold-rolled stainless-steel skin and armored glass.
designers are now selling 'digital clothes' that don't actually exist
#technology
a solution to one of the world's major eco problems might involve creating clothes that don't actually exist.
a solution to one of the world's major eco problems might involve creating clothes that don't actually exist.