Editor Wix: aggiungere colori e sfumature agli sfondi dei tuoi elementi
Tempo di lettura: 5 min.
Crea sfondi accattivanti per i tuoi elementi con colori a tinta unita, gradienti o gradienti sfumati.
In questo articolo, scopri di più su come:
Importante:
Al momento, i gradienti sono disponibili come sfondo solo per i seguenti elementi:
- Strisce e colonne
- Slideshow
- Liste dinamiche
- Menu mobile
- Finestre a comparsa
Aggiungere un colore a tinta unita allo sfondo
Applica un singolo colore allo sfondo. Scegli tra i colori del tema del tuo sito, i colori salvati o aggiungine uno nuovo.
Per modificare il colore di sfondo:
- Clicca sull'elemento pertinente nell'Editor
- Clicca su Cambia sfondo
- Clicca su Colore
- Clicca sull'icona Colore nella parte superiore del selettore colori e seleziona una delle seguenti opzioni:
- Colori tema: questi sono i colori utilizzati nel tema del tuo sito che possono essere applicati automaticamente agli elementi del tuo sito. Seleziona un colore in Colori tema per applicarlo allo sfondo. Puoi anche modificare i colori del tema cliccando su Modifica in alto a destra nel pannello. Per saperne di più
- I miei colori: si tratta di colori che hai precedentemente aggiunto e salvato sul tuo sito. Clicca su un colore in I miei colori per applicarlo allo sfondo
- Scegli un nuovo colore: clicca su Aggiungi per selezionare un nuovo colore Il nuovo colore è quindi disponibile in I miei colori per essere applicato agli elementi del tuo sito
Aggiungere un effetto sfumato allo sfondo
Gli effetti sfumati sono un modo divertente per personalizzare gli elementi e il sito. Scegli un effetto e regola i colori e l'opacità per creare qualcosa di accattivante per i tuoi visitatori. Puoi scegliere tra 3 tipi di sfumature per lo sfondo:
- Lineare: i colori nella sfumatura si trovano agli estremi opposti e si fondono lungo una linea invisibile
- Radiale: i colori si circondano e si fondono lungo un raggio
- Conico: i colori nella sfumatura hanno una transizione ruotata attorno a un punto centrale
Per aggiungere e personalizzare una sfumatura:
- Clicca sull'elemento pertinente nell'Editor
- Clicca su Cambia sfondo
- Clicca su Colore
- Clicca sull'icona Sfumato nella parte superiore del selettore colore
- Clicca sul menu a tendina e seleziona il tipo di sfumatura che desideri applicare
- Personalizza la sfumatura utilizzando le opzioni:
- Lineare:
- Angolo: scegli l'angolo della sfumatura
- Posizioni dei colori e distanza: modifica l'ordine dei colori, avvicinali o allontanali
- Regola colori e opacità: modifica il colore e aumenta o diminuisci l'opacità
- Aggiungi un nuovo colore: clicca in un punto qualsiasi della barra che non contenga già un punto di colore per aggiungere e regolare un nuovo colore
- Radiale:
- Punto centrale: imposta il punto centrale della sfumatura
- Posizioni dei colori e distanza: modifica l'ordine dei colori, avvicinali o allontanali
- Regola colori e opacità: modifica il colore e aumenta o diminuisci l'opacità
- Aggiungi un nuovo colore: clicca in un punto qualsiasi della barra che non contenga già un punto di colore per aggiungere e regolare un nuovo colore
- Conico:
- Posizione e rotazione: clicca e trascina il cerchio interno del punto centrale per modificarne la posizione sullo sfondo e clicca e trascina il cerchio esterno per modificare la rotazione della transizione di colore
- Posizioni dei colori e distanza: modifica l'ordine dei colori, avvicinali o allontanali
- Regola colori e opacità: modifica il colore e aumenta o diminuisci l'opacità
- Aggiungi un nuovo colore: clicca in un punto qualsiasi della barra che non contenga già un punto di colore per aggiungere e regolare un nuovo colore
- Lineare:
Vuoi salvare l'effetto sfumato?
Clicca su Aggiungi nella parte inferiore del pannello per salvare l'effetto sfumato da utilizzare sul tuo sito.
Aggiungere un gradiente sfumato allo sfondo
Crea uno sfondo unico per i tuoi elementi utilizzando i gradienti sfumati. In questi gradienti, ci sono punti lungo il gradiente con colori diversi, che puoi unire esattamente come desideri.
Ci sono preset disponibili per ogni tipo di gradiente nella parte inferiore del pannello. Questi gradienti sono creati utilizzando i colori del tuo sito e possono essere personalizzati in base alle tue esigenze.
Per aggiungere e modificare un gradiente sfumato:
- Clicca sull'elemento pertinente nell'Editor
- Clicca su Cambia sfondo
- Clicca su Colore
- Clicca sull'icona Gradiente sfumato nella parte superiore del selettore colore
- Personalizza la sfumatura utilizzando le opzioni:
- Posizione: modifica la posizione di ciascun colore nel gradiente
- Regola colori e opacità: modifica il colore e utilizza il cursore per aumentare o diminuire l'opacità
- Taglia: imposta la dimensione dei colori nel gradiente
- Diffondi: imposta la diffusione di ciascun colore sul gradiente
- Colore dietro il gradiente: seleziona un colore da visualizzare dietro il gradiente
- Aggiungi un nuovo colore: clicca in un punto qualsiasi dell'anteprima che non contenga già un punto di colore per aggiungere e regolare un nuovo colore. Suggerimento: puoi aggiungere tutti i colori che vuoi, quindi non c'è limite alla personalizzazione del gradiente
Vuoi salvare il gradiente sfumato?
Clicca su Aggiungi nella parte inferiore del pannello per salvare il gradiente e utilizzarlo sul tuo sito. Puoi applicare e aggiungere nuovi gradienti in I miei gradienti sfumati nel pannello.
Applicare gradienti a sfondi video o immagini
Se hai un'immagine o un video di sfondo sul tuo elemento, puoi anche aggiungere un effetto sfumato dietro di esso.
Basta selezionare un video o un'immagine come sfondo, quindi regolare l'opacità del gradiente.
Per applicare sfumature a uno sfondo multimediale:
- Clicca sull'elemento pertinente nell'Editor
- Clicca su Cambia sfondo
- Clicca su Impostazioni
- Clicca sulla casella del colore accanto a Colore dietro il video/l'immagine
- Crea e aggiungi un gradiente
- Clicca sulla X nella parte superiore del selettore colore/gradiente per chiuderlo
- Trascina il cursore in Opacità immagine/Opacità video per rendere visibile il gradiente di sfondo
Hai trovato utile questo articolo?
|