# Colori triadici e palette complementari divise, spiegati [Canonical HTML page](https://gradiently.design/it/guide/triadic-colors) Tre colori equidistanti possono rendere una palette audace ed equilibrata insieme, oppure simile alla scatola dei giocattoli di un bambino. La differenza dipende quasi tutta da quale colore guida. ## The short version - I colori triadici sono tre tinte distribuite in modo uniforme sulla ruota dei colori, a un terzo di cerchio l’una dall’altra, come rosso, giallo e blu sulla ruota del pittore. - Una palette triadica funziona quando un colore domina, un secondo lo sostiene e il terzo è usato come piccolo accento. - Smorzare due dei tre colori è il modo più rapido per rendere adulta una palette triadica. - Una palette complementare divisa usa una tinta più le due tinte ai lati del suo opposto, e dà un contrasto forte con meno tensione. - I colori triadici di solito rendono meglio come aree separate che fusi insieme in un unico gradiente. I **colori triadici** sono tre tinte distribuite in modo uniforme sulla ruota dei colori, ognuna a un terzo di cerchio dalle altre. Sulla ruota del pittore, rosso, giallo e blu formano una triade, così come arancione, verde e viola. Poiché le tre sono ugualmente distanti, nessuna sovrasta le altre per la sola posizione, e questo rende le palette triadiche vivaci ed equilibrate. Le rende anche facili da esagerare. Questa guida copre le triadi, la regola che evita l’effetto scatola dei giocattoli e lo schema complementare diviso, un parente stretto più facile da controllare. La guida alla [ruota dei colori](https://gradiently.design/it/guide/color-wheel) spiega i due tipi di ruota citati qui sotto. ## Schemi di colori triadici sulla ruota | Triade | Ruota | Carattere | | --- | --- | --- | | Rosso, giallo, blu | Del pittore (primari) | Audace, grafico, familiare | | Arancione, verde, viola | Del pittore (secondari) | Terroso, insolito, ricco | | Rosso arancio, giallo verde, blu viola | Del pittore (terziari) | Moderno, meno prevedibile | | Rosso, verde, blu | Dello schermo (RGB) | Tecnico, rumoroso a piena intensità | | Ciano, magenta, giallo | Dello schermo (RGB) | Da stampa, giocoso | Triadi comuni. Ruota il triangolo in qualsiasi punto della ruota per trovarne altre. - Blu navy (blu): #1e3a8a - Senape (giallo): #d4a017 - Mattone (rosso): #b91c1c - Oliva (verde): #4d7c0f - Prugna (viola): #6b21a8 - Arancio bruciato: #c2410c La triade primaria e quella secondaria, ognuna scurita rispetto alla piena saturazione così stanno insieme più facilmente. ## La regola della dominanza: un colore guida Tre colori accesi in quantità uguali competono per l’attenzione e sembrano infantili. La soluzione è metterli in ordine. Un colore copre la maggior parte del design, un secondo lo sostiene e il terzo compare solo dove vuoi che cada lo sguardo. Una divisione 60, 30 e 10 è un buon punto di partenza, come nella [regola 60-30-10](https://gradiently.design/it/guide/60-30-10-rule). - Terzi uguali: in competizione: `linear-gradient(90deg, #b91c1c 0% 33.3%, #d4a017 33.3% 66.6%, #1e3a8a 66.6% 100%)` - 60, 30, 10: guida il blu navy: `linear-gradient(90deg, #1e3a8a 0% 60%, #d4a017 60% 90%, #b91c1c 90% 100%)` - 60, 30, 10: guida l’oliva: `linear-gradient(90deg, #4d7c0f 0% 60%, #6b21a8 60% 90%, #c2410c 90% 100%)` Lo stesso tipo di triade in proporzioni diverse. Mettere in ordine i colori trasforma il rumore in una palette. Quale colore deve guidare? Di solito il più scuro o il meno saturo, perché grandi aree di un colore acceso stancano. Tieni il più brillante per l’accento. Se il colore del tuo brand fa parte della triade, spesso è la guida più ovvia. ## Smorzare una triade Il secondo strumento è la saturazione. Tieni un colore forte e spingi gli altri due verso il grigio, più scuri o più chiari. La struttura della triade resta, quindi la palette sembra ancora equilibrata, ma perde la brillantezza da scuola elementare. Molte palette editoriali e d’ispirazione storica sono triadi travestite: blu navy, ocra e mattone, oppure oliva, prugna e ruggine. - Blu inchiostro: #1f2a44 - Avena: #e9dcc3 - Ocra: #b98b2e - Mattone: #9b3d33 Una triade primaria smorzata con un neutro caldo. Si legge come editoriale più che giocosa. ## Dove funzionano le palette triadiche Le triadi si adattano a brand e progetti che vogliono sembrare energici, inclusivi o giocosi senza sembrare casuali: educazione per bambini, giochi, festival, cibo e progetti di comunità. Sono utili anche per sistemi che richiedono tre categorie ben distinte, come tre linee di prodotto, tre livelli di corso o tre tipi di evento, perché ogni colore è il più lontano possibile dagli altri due. - **Tre categorie:** dai a ognuna il suo colore della triade e tieni i layout identici, così è il colore a fare lo smistamento. - **Un brand, una guida:** usa il colore guida ovunque e porta gli altri due in illustrazioni, grafici ed evidenziazioni. - **Poster e packaging:** una triade smorzata su un neutro caldo dà un’aria da stampa di metà Novecento. Pianifica i colori per l’inchiostro; vedi [stampare i gradienti](https://gradiently.design/it/guide/print-gradients). - **Interfacce:** tieni la triade per stati e illustrazioni e lascia che i neutri reggano le schermate, altrimenti ogni pagina sembrerà rumorosa. ## Colori complementari divisi Uno schema complementare diviso parte da una tinta e, invece del suo opposto diretto, usa le due tinte ai lati di quell’opposto. Mantieni gran parte del contrasto di una [coppia complementare](https://gradiently.design/it/guide/complementary-colors) ma perdi lo scontro frontale, e guadagni un terzo colore con cui lavorare. È uno degli schemi più indulgenti per chi inizia. - Base: viola: #5b21b6 - Divisione: lime: #a3e635 - Divisione: ambra: #f59e0b - Neutro: bianco lilla: #f5f3ff L’opposto del viola sulla ruota del pittore è il giallo. Lo schema diviso usa i colori ai suoi lati, lime e ambra. - **Colore di base:** la guida, usata per gran parte del design. - **Primo colore diviso:** sostegno, in aree più piccole o in una versione più quieta. - **Secondo colore diviso:** l’accento, usato con parsimonia. - **Neutro:** un quasi bianco o un quasi nero che tiene tutto insieme. ## Colori triadici nei gradienti Fondere tutti e tre i colori di una triade in un unico gradiente costringe la sfumatura ad attraversare ogni tinta tra loro, e almeno un passaggio di solito si spegne. Le triadi funzionano meglio come aree separate, o come gradiente a due colori con il terzo tenuto come accento. - Tutti e tre fusi: seconda metà fangosa: `linear-gradient(90deg, #b91c1c 0%, #d4a017 50%, #1e3a8a 100%)` - Dal blu navy al mattone, via prugna: `linear-gradient(135deg, #1e3a8a 0%, #6b2a6e 55%, #b91c1c 100%)` - Senape tenuta come accento a bordo netto: `linear-gradient(135deg, #1e3a8a 0%, #6b2a6e 50%, #b91c1c 86%, #d4a017 86%, #d4a017 100%)` Due colori della triade si fondono; il terzo resta a parte. La metà dal giallo al blu del primo esempio mostra perché. ## Errori con le palette triadiche ### Da evitare - Tre colori saturi in quantità uguali - Testo nel colore d’accento - Tutti e tre fusi in un solo gradiente - Nessun neutro su cui far riposare l’occhio ### Da fare - Una guida, un sostegno, un accento - Testo in un neutro con contrasto forte - Aree separate, oppure due fusi più un accento - Un quasi bianco o un quasi nero accanto Se una triade sembra ancora troppo rumorosa, scendi a una [palette analoga](https://gradiently.design/it/guide/analogous-colors), dove i colori sono vicini invece che opposti. ## FAQ ### Cosa sono i colori triadici? I colori triadici sono tre tinte distribuite in modo uniforme sulla ruota dei colori, a un terzo di cerchio l’una dall’altra, come rosso, giallo e blu sulla ruota del pittore. ### Come si usa uno schema di colori triadico? Lascia che un colore domini, un secondo sostenga e il terzo faccia da piccolo accento. Smorzare due dei tre rende la palette più facile da gestire. ### Che cos’è uno schema complementare diviso? Una tinta di base più le due tinte ai lati del suo complementare. Mantiene un contrasto forte con meno tensione di una coppia complementare diretta. ### Che differenza c’è tra colori triadici e complementari? Lo schema complementare usa due tinte opposte; quello triadico usa tre tinte equidistanti sulla ruota. Le triadi sono più varie e di solito un po’ meno tese.