Usare il clip-path con Clippy

In questo articolo abbiamo visto come usare clip-path.

Il suo utilizzo, comunque, non è dei più semplici; ma girovagando per il web, ho trovato un servizio molto utile: Clippy!

In pratica ci consente di manipolare le forme, e come risultato ci da il CSS da mettere nel nostro sito.

Nella parte centrale / sinistra, avete una immagine con dei pallini da spostare.

Sulla destra avete:

• delle fiigure da cui partire
• delle immagini tra cui scegliere
• la dimensione

Se provate ad aprirlo con Firefox, otterrete un warning in altro a destra, in quanto non è compatibile con clip-path.

E' anche possibile creare una figura custom.

In questo caso sarete voi a piazzare i vari pallini colorati, e a spostarli come più vi piace.

Nella parte bassa avete il CSS in tempo reale.

Vi basterà copiarlo per essere pronti.

Enjoy!