Color Picker è la funzione del tuo editor che ti consente di gestire la combinazione di colori di testo, sfondo, sovrapposizioni e altro ancora. Puoi scegliere un colore dalla tavolozza dei colori, inserire un valore HEX o RGB o persino creare un gradiente personalizzato. La funzione dei colori recenti ti aiuterà a mantenere coerente la tua combinazione di colori e a mantenere un aspetto professionale sul tuo sito.
Prima di scegliere la combinazione di colori, è necessario scegliere dove si desidera utilizzare un singolo colore o un gradiente.
Se stai utilizzando l'opzione colore singolo, puoi scegliere un colore dalla scheda Colori recenti o passare a Scegli un altro colore.
Lo sfondo sfumato sarà un'opzione disponibile per gli sfondi di righe, colonne e widget e per le sovrapposizioni di immagini. Per applicare una sfumatura, con il selettore di colori aperto, fai clic sul menu a discesa sopra la tavolozza dei colori (potrebbe indicare Colore), seleziona Sfumatura, quindi assicurati di:
-
Scegli due sfumature di uno stesso colore
-
Puoi sempre invertire i colori, regolando il posizionamento dei cursori
-
-
Scegli la direzione della sfumatura
-
Con l'opzione Centrale otterrai una sfumatura radiale
-
L'opzione Laterale darà una sfumatura lineare
-
Nota
I gradienti non possono essere salvati in Colori tema.
I colori del tema consentono di definire una tavolozza di colori e di collegare i singoli colori a uno o tutti i widget con le impostazioni del colore. Il colore di qualsiasi elemento collegato ai colori del tema verrà aggiornato automaticamente quando il colore collegato viene modificato nelle impostazioni dei colori del tema. Ciò ti consente di apportare rapidamente modifiche al colore, il che aiuta a ridurre i tempi di progettazione e garantisce che lo stile del tuo sito sia coerente tra le pagine.
Per informazioni su come configurare i colori del tema, vedere Colori del tema.
Salva i colori che usi spesso nel sito aggiungendoli all'elenco Colori salvati nel selettore colori.
Per aggiungere un colore ai colori salvati, fare clic sulla scheda Colori salvati nel selettore colore e fare clic sull'icona +. Per rimuovere un colore dall'elenco Colori salvati, fare clic con il pulsante destro del mouse sul colore e selezionare Rimuovi.
Puoi aggiungere fino a 48 colori e sfumature all'elenco Colori salvati.
Seleziona una tonalità, utilizzando la tavolozza sulla destra o il pannello colori. In alternativa, puoi inserire il valore HEX o RGB del colore che desideri utilizzare nella casella di testo riportata sotto la colonna delle sfumature.
Per abbinare perfettamente un colore da qualsiasi punto del tuo sito (immagini, testi e così via), fai clic sul contagocce () tool e seleziona il colore del tuo sito che desideri utilizzare. Non c'è bisogno di perdere tempo a cercare di capire il nome o il valore esatto di un colore.
Il controllo del contrasto per i colori del testo consente di migliorare l'accessibilità dei siti indicando se il contrasto tra il testo e lo sfondo soddisfa lo standard AA o AAA*. Il controllo del contrasto viene visualizzato nel selettore colore ogni volta che viene utilizzato per il testo.
Di seguito sono riportati i criteri che determinano se lo standard AA o AAA è soddisfatto:
Tipo di testo |
Standard* |
Dimensioni del carattere |
Rapporto di contrasto minimo |
---|---|---|---|
Testo normale |
AAA |
Meno di 18pt |
7:1 |
Testo grande |
AAA |
18 o 14 pt grassetto |
4.5:1 |
Testo normale |
AA |
Meno di 18pt |
4.5:1 |
Testo grande |
AA |
18pt grassetto o 24pt e oltre |
3:1 |
*Negli standard di accessibilità, "AA" e "AAA" rappresentano diversi livelli di requisiti di contrasto dei colori. Il livello AA significa che i colori hanno un contrasto sufficiente per essere leggibili, ma potrebbe comunque presentare problemi per alcuni utenti. Il livello AAA significa che hai un contrasto elevato che dovrebbe essere leggibile per la stragrande maggioranza dei tuoi utenti.
Di seguito è riportato un esempio del controllo colore del contrasto che indica che il contrasto del testo e dello sfondo soddisfa lo standard AAA.
Il controllo del contrasto sarà disabilitato nelle seguenti circostanze:
-
Se il testo selezionato ha più colori. Ad esempio, se diverse parole nel testo sono blu e molte altre sono rosa.
-
Se il testo si trova su uno sfondo sfumato.
-
Se il testo si trova su uno sfondo dell'immagine.
-
La sfumatura non è disponibile per gli elementi di testo, quindi non verrà visualizzata in un selettore colore per gli elementi di testo nell'editor di progettazione dei widget della scheda Tema.
-
Quando si lavora con gli sfondi, il passaggio da Colore a Immagine e viceversa imposta le impostazioni dell'opzione precedente su null. Ad esempio, se stavi utilizzando un colore e hai modificato l'impostazione in Immagine, tutte le impostazioni di colore o sfumatura verranno rimosse.
-
I gradienti prevalgono sugli sfondi dei singoli pulsanti. Per cambiarli di nuovo, riselezionare lo sfondo dei singoli pulsanti.