I colori in diverse aree della tua community possono essere aggiunti e modificati. Per esempio, puoi usare il Theme Designer per personalizzare la palette di colori della wiki. Puoi anche aggiungere colori più specifici attraverso i template o il CSS della community.
Definire i colori
Codici esadecimali
Praticamente tutti i colori immaginabili possono essere rappresentati da un codice esadecimale (hex) a sei cifre — una rappresentazione numerica della quantità di rosso, verde e blu presente in quel particolare colore. RGBA è un altro modello per rappresentare i colori usato frequentemente sul web. Include non solo il rosso, il verde e il blu ma anche il canale "alfa" o trasparenza. Pertanto, i codici hex e RGB/RGBA sono più precisi — benché meno facili da usare — dei nomi dei colori.
Nelle tabelle sotto ci sono alcuni codici hex di alcuni colori. Se vuoi usare uno di questi, aggiungili dove ritieni appropriato. Per esempio, se vuoi rendere il colore dei pulsanti bianco con il Theme Designer, copia il codice hex di quel colore (#FFFFFF) e inseriscilo nell'entrata corrispondente.
Nota: i codici hex non distinguono le maiuscole, quindi #ffffff e #FFFFFF rappresentano la stessa cosa.
Nomi dei colori
Ci sono due tipi principali di nomi dei colori che sono preferiti, colori HTML e colori web.
Nomi colori HTML
Per semplicità di utilizzo, alcuni colori hanno una parola chiave — un nome (non sensibile alla maiuscole), come red e YELLOW. Le specifiche di HTML 4.01 [1] definiscono sedici parole chiave per colori "di base":
| Nome | Codice hex |
|---|---|
| cyan | #00FFFF |
| navy | #000080 |
| black | #000000 |
| olive | #808000 |
| blue | #0000FF |
| purple | #800080 |
| fuchsia | #FF00FF |
| red | #FF0000 |
| Nome | Codice hex |
|---|---|
| green | #008000 |
| silver | #C0C0C0 |
| gray | #808080 |
| teal | #008080 |
| lime | #00FF00 |
| white | #FFFFFF |
| maroon | #800000 |
| yellow | #FFFF00 |
Nomi colori RGBA
Nota: Potresi anche trovare codici RGB che sono gli stessi dei codici RGBA ma senza il canale alfa. Questo li rende in pratica equivalenti ai colori HTML elencati sopra.
I canali del colore variano in valore da 0 a 255, con il canale alpha o trasparenza che è sempre un valore tra 0 e 1, con 0 che denota trasparenza completa e 1 che denota opacità completa, o niente trasparenza.
Il primo numero dei quattro rappresenta il canale rosso, il secondo rappresenta il canale verde, il terzo rappresenta il canale blue e il quarto il canale alfa.
| Nome | Codice RGBA |
|---|---|
| cyan | rgba(0, 255, 255, 1) |
| navy | rgba(0, 0, 128, 1) |
| black | rgba(0, 0, 0, 1) |
| olive | rgba(128, 128, 0, 1) |
| blue | rgba(0, 0, 255, 1) |
| purple | rgba(128, 0, 128, 1) |
| fuchsia | rgba(255, 0, 255, 1) |
| red | rgba(255, 0, 0, 1) |
| Nome | Codice RGBA |
|---|---|
| green | rgba(0, 128, 0, 1) |
| silver | rgba(192, 192, 192, 1) |
| gray | rgba(128, 128, 128, 1) |
| teal | rgba(0, 128, 128, 1) |
| lime | rgba(0, 255, 0, 1) |
| white | rgba(255, 255, 255, 1) |
| maroon | rgba(128, 0, 0, 1) |
| yellow | rgba(255, 255, 0, 1) |
Nomi dei colori web
Se hai mai speso del tempo a programmare, però, saprai che ci sono altri nomi dei colori, come cornflowerblue e linen. Queste parole chiave estese sono nomi dei colori X11, definiti dai browser web.
La prima versione del sistema grafico X Window System determinava le parole chiave dei colori attraverso i nomi X11. Oggi, i colori web, il sistema che deriva da X11, fornisce molti colori disponibili.
Un lunga e utile lista di nomi di colori utilizzabili e i loro codici hex equivalenti possono essere trovati su Wikipedia.[2][3]
Colori fluorescenti
I colori fluorescenti o neon possono sembrar brillare sulle pagine della wiki, a seconda di come imposti i tuoi colori di base nel Theme Designer. L'effetto può essere efficace e lasciare a bocca aperta. Quindi prova a giocare con i colori seguenti. Ma ricorda: basta poco neon per fare tanta strada!
| Nome | Codice hex |
|---|---|
| Rainshower | #C9FFE5 |
| Blizzard Blue | #A3E3ED |
| Psychedelic Purple | #FA00FF |
| Harlequin | #3FFF00 |
| Bubbles | #E7FEFF |
| Razzle Dazzle Rose | #FF33CC |
| Electric Purple | #BF00FF |
| Hot Magenta | #FF00CC |
| Neon Carrot | #FFA343 |
| Chartreuse Yellow | #DFFF00 |
| Shocking Pink | #FC0FC0 |
| Nome | Codice hex |
|---|---|
| Screamin' Green | #66FF66 |
| Purple Pizzazz | #FE4EDA |
| Electric Violet | #8B00FF |
| Sunglow | #FFCC33 |
| Electric Lime | #CCFF00 |
| Snowy Mint | #D6FFDB |
| Flamingo Pink | #FF66FF |
| Infra Red | #FF496C |
| Laser Lemon | #FFFF66 |
| Phlox | #DF00FF |
| Veronica | #A020F0 |
Diversi strumenti online sono disponibili per aiutarti a scegliere il colore giusto.
Colori e accessibilità
Benché essere creativi con il colore può migliorare molto il look della tua wiki, è importante ricordarsi che non tutti percepiscono i colori allo stesso modo. Mantenere la tua wiki accessibili alle persone daltoniche, con problemi di vista o disabili è anch'esso importante.
Contrasti netti possono essere considerati fastidiosi per gli occhi e dovrebbero essere evitati. Un sito utile è Contrast Checker.
Note
Vedi anche
- Colori Web su Wikipedia, da cui è stata tratta questa pagina
- 4096 Color Wheel
- Color Names and Hue by Colblindor
- Cosa fare e non fare nel design con colori neon
- Color Blindness & Web Design
- Una panoramica di come il contrasto influenza le scelte di colori sulla tua wiki
- Modificare il look della wiki con il Theme Designer
Aiuto aggiuntivo e feedback
- Naviga e cerca altre pagine di aiuto su Contenuti.
- Esplora la Wiki della Community per ulteriori fonti di aiuto o supporto.
- Leggi come contattare Fandom per problemi o segnalare errori.