Card con animazione liquida in CSS.
![](https://straquenzu.p3lus0s.net/wp-content/uploads/2019/03/Cattura-1024x551.png)
Oggi ho realizzato una card in CSS, utilizzando un tipo di animazione che che definisco “liquida” per via di una serie di accortezze che aumentano la percezione di morbidezza e organicità.
L’esempio è stato realizzato semplicemente utilizzando 2 layers diversi (blu e giallo) con un border-radius irregolare, ovvero con quantità di raggio diverse per lato destro o sinistro.
border-radius: 44%/45%;
In questo modo la figura di partenza, ovvero un quadrato, avrà delle sembianze irregolari tendenti sempre di piu al cerchio, che ha border-radius 50%.
Vedere il codice d’esempio per i dettagli implementativi.
Unisciti alla discussione