PDA

View Full Version : The oil portrait made with CSS



pendell
2018-05-03, 10:23 AM
Seen on Digg (http://digg.com/2018/purecss-francine)



Andy Baio managed to surface the brilliant work of UI engineer Diana Smith, who has created three incredible works of art with nothing but lines of code.

Here, for example is 18th century oil painting, hand-coded by Smith. She calls it, 'purecss-francine'

...

It's maybe not the most efficient way to make an image, but was more of a self-imposed challenged for Smith. In the Github page for her portrait she lays our her rules:

All elements must be typed out by hand
Only Atom text editor and Chrome Developer Tools allowed.
SVG use is limited, and all shapes can only use hand-plotted coordinates and bezier curves - without the aid of any graphics editor.

...

In addition to purecss-francine, Smith has two other creations made with the same restrictions. The first is an iconic '30s print advertisement for fruit, called 'purecss-vignes', and the other is a pin-up cigarette add named 'purecss-zigaro'.

Smith has an important caveat for these creations. "Because of the artistic nature of this project I have not concerned myself with cross-browser-compatibility," she writes on her Github page. "So the live preview will most likely look laughable in anything other than chrome."



It is quite beautiful. I hope it survives upgrades and so forth.

Respectfully,

Brian P.

Elanasaurus
2018-05-03, 11:26 AM
Cool challenge! I guess it would have been quite difficult to type all the elements by hand and all that coding stuff that I don't understand.
I have nothing really to contribute to this discussion so..um..
First!
:elan:
EDIT: hey my second sentence rhymed!