Mondrian ist berühmt für seine Gemälde mit dicken schwarzen Linien, die ein Gitter bilden, wobei jede Zelle weiß, rot, gelb oder blau ist. Diese Ästhetik passt gut zum berüchtigt rechteckigen Web, und das ist über die Jahre hinweg von CSS-Entwicklern nicht unbemerkt geblieben. Ich sah neulich einige Mondrian-Kunstwerke in CSS und beschloss, nach anderen zu suchen, die ich im Laufe der Jahre gesehen habe, und sie zusammenzustellen.
Vasilis van Gemert
Was wäre, wenn Mondrian CSS statt Farbe verwendet hätte?
Viele Leute haben versucht, ein Kunstwerk von Mondriaan mit CSS nachzubilden. Es scheint eine nette und einfache Übung zu sein: Rechtecke sind mit CSS einfach, und jetzt mit Grid ist es einfach, die meisten seiner Werke nachzubilden. Ich habe es auch versucht, und es stellte sich als etwas komplizierter heraus, als ich dachte. Und die Ergebnisse sind, nun ja, überraschend.
Jen Simmons Lab
Mondrian Kunst in CSS Grid
Ich liebe es, wie Jen die Extra-Meile mit der Textur gegangen ist. Wie die meisten dieser Beispiele wird CSS Grid stark genutzt.
Jen Schiffer
var t;: Piet Mondrian
Ich habe mit Mondrian angefangen, nicht weil er mein Lieblingskünstler ist (das ist er nicht), oder weil seine Werke sehr wiedererkennbar sind (das sind sie), sondern weil ich dachte, es wäre ein lustiger (ja) und einfacher Anfang (lol nein) für dieses Projekt.
Riley Wong
Erstellen Sie Ihr eigenes Mondrian-Stil-Gemälde mit Code
Auf GitHub gibt es ein 12-Schritte-Tutorial.
Adam Fuhrer
CSS Mondrian
Generatives Kunstwerk im Piet Mondrian Stil mit CSS Grid.
John Broers
CSS Mondriaan Grid
Das habe ich vor ein paar Jahren gemacht, als CSS gerade herauskam!
https://codepen.io/ciampo/full/xqddJZ
Ich habe eine Bauhaus-inspirierte CSS-Schrift https://davorsuljic.github.io/css-fluid-grid-font.html mit meiner Interpretation von Mondrian-Kunst kombiniert.
Schweben zum Animieren – nur in Firefox!