Attention Required ! | Cloudflare

/pen

  • Oh là là, c’est super-trop-cool parce que c’est super-trop simple : ici des « metaballs » qui fusionnent et se séparent, façon amibes, directement en CSS :
    https://codepen.io/mirajm212/pen/Iivdj

    Et c’est vraiment très con : les éléments sont rendus flous par un filtre CSS, ce qui provoque la fusion des formes quand elles se rapprochent, et l’élément englobant rend tout extrêmement net avec un filtre de contraste.

    Ah purée il faut que je trouve une interface dans laquelle utiliser ce genre de truc, c’est trop cool.

    • Oui, c’est tout simple. Et le fait que les animations soient gérées en CSS, c’est toujours chic :-) (on peut de plus en plus faire des choses très animées et sympa, optimisées du feu de dieu, sans utiliser Javascript, perso j’adore ça).

      En revanche, la limite c’est que c’est conçu pour un fond uni, parce que l’étape de renforcement des contrastes se fait avec un fond. Installer ça par-dessus un autre élément de page (par exemple une image), c’est pas trop fait pour.

      Pour l’instant, la seule façon de placer ça par dessus un autre élément, ce serait de jouer avec les mix-blend-mode (et donc leurs limites).