Art génératif · CSS @property · Portrait naturaliste

Humboldt Vivant

Un portrait où la nature respire. Hommage à Alexander von Humboldt et à sa vision de la Terre comme un seul organisme vivant : un récit éditorial habité par des formes biomorphiques qui se déforment lentement, comme une matière organique. Prête à habiller votre site.

Les masses colorées ne sont pas des images : ce sont des formes vivantes qui morphent en continu. Faites défiler, chaque tableau éveille sa propre composition botanique.

Cette pièce sur votre site Intégrer cette pièce dès CHF 890 Vous êtes une agence ?

La technique derrière le design

Les masses organiques ne sont pas des dessins figés : elles sont interpolées en direct par le moteur de rendu. La pièce exploite CSS @property (Houdini) pour animer nativement des dizaines de coordonnées de clip-path polygon() : chaque blob biomorphique se déforme en boucle, fluide et organique, sans une seule ligne de code d'animation impérative. Les motifs botaniques se tracent au chargement par stroke-dashoffset, et un IntersectionObserver réveille chaque tableau au scroll (activation paresseuse = léger). Un générateur Mulberry32 à graine fixe garantit une composition reproductible. L'ensemble compose un récit en trois tableaux éditoriaux (palette ivoire, cuivre, terracotta et jade) sur une grille cartographique discrète. Zéro canvas, zéro WebGL, zéro librairie, zéro CDN. Repli gracieux via @supports et respect de « mouvement réduit ». Fichier unique autonome, intégration en 5 minutes.

Idéal pour

Wellness premiumÉdition & beaux livresArchitecture bioFoodTech & AgriTechGalerie d'artCosmétique naturelleJardins & botaniqueHôtellerie nature

Palette, herbier vivant

Ivoire #F5ECD5
Cuivre #B87333
Terracotta #C4704A
Jade #3D6B4F
Encre #1C130A

Questions fréquentes

Les formes sont-elles vraiment animées en direct ?

Oui. Aucune vidéo ni GIF : les masses organiques morphent en temps réel grâce à l'interpolation native de CSS @property sur des dizaines de points de clip-path. Le navigateur recalcule la forme à chaque image : un mouvement fluide, continu et très léger.

Qui était Alexander von Humboldt ?

Naturaliste et explorateur prussien (1769–1859), pionnier d'une vision holistique de la nature : il voyait la Terre comme un seul organisme où tout est relié, climat, géologie, faune, flore. Cette pièce traduit visuellement cette idée d'une « totalité vivante », en trois tableaux éditoriaux.

Combien coûte l'intégration de cette pièce ?

L'intégration démarre à CHF 890. On accorde la palette (ivoire, cuivre, terracotta, jade) à votre charte, on règle la vitesse et l'opacité des formes biomorphiques, on adapte les trois tableaux à votre contenu, puis on pose le récit en page éditoriale ou en section. C'est un fichier unique autonome, sans CDN. Un site signature construit autour démarre à CHF 2 500.

Est-ce léger et accessible ?

Oui. Pas de canvas ni de GPU : uniquement du CSS et du SVG, extrêmement légers. Les animations s'activent au scroll (lazy), respectent le réglage « mouvement réduit » et offrent un repli gracieux sur les anciens navigateurs. Contraste conforme WCAG AA.

Comment on l'intègre

On plante la pièce chez vous. On accorde la palette (ivoire, cuivre, terracotta, jade) à votre charte, on règle la vitesse et l'opacité des formes biomorphiques, on adapte les trois tableaux à votre contenu, puis on pose le récit en page éditoriale ou en section sur votre site. Intégration dès CHF 890. Un site signature bâti autour de ce portrait botanique démarre à CHF 2 500. Hébergement suisse, code livré, pleine propriété.

Parlons de votre projet Discuter de cette intégration intégration dès CHF 890