Come creare Effetto Vetro su Elementor

Vuoi imparare come fare in modo di utilizzare il glassmorphism (effetto vetro) su elementor, magari nell’Header o come sfondo di un determinato elemento?

E’ molto semplice!

Ti basterà copiare e incollare questo codice e fare in modo di inserire come colore di sfondo, un colore in semitrasparenza.

Ecco il codice:

.vetro {
	backdrop-filter:blur(20px);
}
  1. Questo codice CSS lo puoi inserire direttamente nel CSS personalizzato dell’elemento, oppure nelle Impostazioni pagina:

2. Una volta inserito questo codice CSS, dovrai inserire la classe .vetro all’elemento a cui lo vuoi applicare:

3. e impostare lo sfondo semi-trasparente, settando come preferisci il valore della trasparenza!

Puoi anche cambiare il valore della sfocatura che vuoi applicare fino a quando non raggiungi un risultato che reputi soddisfacente, andando a modificare il valore all’interno di blur(20px), inserendo ad esempio blur(10px) oppure blur(35px).

Su Elementor puoi utilizzare questi codici come più ti piace, potrai inserirlo in un singolo testo, ma se ne hai bisogno più volte all’interno della pagina, ti consiglio come in questo caso di utilizzare una classe, perchè è replicabile su ogni elemento alla quale la applichi.

Condividi l'articolo:
Ti possono interessare anche...