Generatore di palette cromatiche: schemi armoniosi da un colore di base
Con il generatore di palette cromatiche crei online una palette partendo da un solo colore di base: scegli un colore o inserisci un codice HEX e compaiono subito sei schemi cromatici armoniosi, ciascuno con valori HEX, RGB e HSL. È gratuito, non richiede registrazione e calcola tutto nel tuo browser.
Creato da Justin Schuessler
La palette è pronta? Metti online il tuo sito con un hosting web veloce e affidabile.
Seleziona il colore di base
Tutte le combinazioni di colori qui sotto vengono calcolate in tempo reale a partire da questo colore.
Complementare
Il colore di base e quello opposto sulla ruota cromatica (180°): forte contrasto, ideale per gli accenti.
Analogico
Tre tonalità adiacenti (±30°): armoniose e rilassanti, spesso presenti in natura.
Triadico
Tre tonalità equidistanti (a 120°): vivaci ma equilibrate.
Complementare diviso
Il colore di base e i due colori adiacenti al suo complementare: contrasto più equilibrato.
Tetradico
Quattro tonalità in due coppie complementari (a 90°): una combinazione ricca, ideale con un colore dominante.
Monocromatico
Cinque variazioni dello stesso colore (tinte, toni e ombre): discrete e perfettamente armoniose.
Continua con il colore di base: Verifica il contrasto · Visualizza nel simulatore di daltonismo · Apri nel selettore colori
Nessuno di questi dati viene salvato o trasmesso: ogni colore viene calcolato esclusivamente nel tuo browser.
Funzioni
Cosa puoi fare con il generatore di schemi cromatici
Basta un colore di base: il generatore calcola combinazioni armoniose secondo le regole della teoria del colore.
Sei schemi cromatici a colpo d'occhio
Complementare, analogo, triadico, complementare diviso, tetradico e monocromatico sono affiancati e si aggiornano in tempo reale a ogni modifica del colore di base, senza pulsante di generazione.
Scegli liberamente il colore di base
Area colore per saturazione e luminosità, cursore per la tonalità, campo HEX (a sei cifre o nella forma abbreviata a tre cifre) oppure valori RGB da 0 a 255. Oppure parti con «Colore casuale».
HEX, RGB e HSL per ogni colore
Ogni campione mostra il codice HEX e i valori RGB e HSL. Clicca su un campione o sull'anteprima grande del colore di base per copiare il codice HEX negli appunti.
Condividi la palette tramite link
Il colore di base compare automaticamente nell'URL, per esempio ?color=3b82f6. Chi apre il link vede lo stesso colore di base e gli stessi sei schemi cromatici.
Calcolato nel tuo browser
Tutti i colori vengono calcolati nel tuo browser. Non ti serve un account e la tua scelta dei colori non viene né salvata né inviata a un server.
Passa al contrasto e all'accessibilità
Sotto gli schemi cromatici puoi inviare il colore di base con un clic allo strumento di controllo del contrasto, al simulatore di daltonismo o al selettore colore.
Come funziona
Come creare una palette da un colore di base
Sei passaggi dal primo colore alla palette completa.
Passaggio 1
Seleziona il colore di base
Clicca o trascina nell'area colore per impostare saturazione e luminosità, poi regola la tonalità con il cursore sottostante.
Passaggio 2
Inserisci un codice HEX o valori RGB
In alternativa, inserisci un codice HEX come #3B82F6 o tre valori RGB. Con «Colore casuale» parti da un colore di base casuale.
Passaggio 3
Confronta gli schemi cromatici
I sei schemi cromatici (complementare, analogo, triadico, complementare diviso, tetradico e monocromatico) si aggiornano subito.
Passaggio 4
Copia il codice colore
Clicca su un campione per copiarne il codice HEX. I valori RGB e HSL sono subito sotto.
Passaggio 5
Condividi la palette
Copia l'indirizzo dalla barra degli indirizzi. Il colore di base è nel link come ?color=…: così puoi riaprire la palette in seguito o inviarla ad altri.
Passaggio 6
Verifica il contrasto
Apri il colore di base nel controllo del contrasto tramite «Verifica contrasto» oppure visualizzalo nel simulatore di daltonismo.
Armonia cromatica
Panoramica dei sei schemi cromatici
Ogni tonalità corrisponde a un angolo tra 0° e 360° nel cerchio cromatico. Cinque dei sei schemi cromatici si ottengono ruotando la tonalità del colore di base di angoli fissi, senza cambiare saturazione e luminosità. Lo schema monocromatico modifica invece solo la luminosità.
Complementare
2 colori · colore di base + 180°
Il colore di base e quello esattamente opposto nel cerchio cromatico. Massimo contrasto cromatico, ideale per elementi in evidenza come i pulsanti.
Analogico
3 colori · −30°, colore di base, +30°
Il colore di base con i due colori adiacenti nel cerchio cromatico. Crea un effetto calmo e armonioso.
Triadico
3 colori · 0°, 120°, 240°
Tre tonalità distribuite uniformemente nel cerchio cromatico. Più vivace di uno schema analogo, ma comunque equilibrato.
Complementare diviso
3 colori · colore di base + colore complementare ±30°
Anziché il colore complementare, lo schema usa i due colori adiacenti. Offre quasi lo stesso contrasto dello schema complementare, ma con meno tensione visiva.
Tetradico
4 colori · 0°, 90°, 180°, 270°
Due coppie di colori complementari distanziate di 90°. Uno schema ricco, che funziona meglio con un colore dominante.
Monocromatico
5 colori · stessa tonalità, cinque livelli di luminosità
Tonalità e saturazione restano uguali: cambia solo la luminosità, dallo scuro al chiaro. I cinque livelli restano distinguibili anche con colori di base molto chiari o molto scuri.
Sfondo
Trova il colore complementare e abbina i colori
Cerchio cromatico per lo schermo, non per la tavolozza
Il generatore ruota la tonalità nel cerchio cromatico HSL, il modello di colore degli schermi. Qui il verde puro #00FF00 ha come complementare il magenta #FF00FF, mentre il blu puro #0000FF ha il giallo #FFFF00. Nel cerchio cromatico classico della pittura (rosso, giallo, blu), invece, le coppie sono verde e rosso, blu e arancione. Entrambe le risposte sono corrette nel rispettivo modello di colore.
Distribuire i colori nel design
Una regola pratica diffusa è quella del 60-30-10: circa il 60 % di colore principale, il 30 % di colore secondario e il 10 % di colore d'accento. Il generatore non la applica automaticamente. Decidi tu quale ruolo assegnare a ogni colore dello schema, per esempio il colore di base come principale e il complementare come accento.
Armonioso non significa leggibile
Uno schema cromatico armonioso non garantisce un contrasto sufficiente tra testo e sfondo. Verifica quindi la combinazione finale nello strumento di controllo del contrasto prima di usarla su un sito web o in un'app. Il link «Verifica contrasto» sotto gli schemi cromatici invia direttamente il tuo colore di base allo strumento.
Scopri di più
Altri strumenti per colori e accessibilità
Selettore colori
Converti i colori in tempo reale tra HEX, RGB, HSL, HSV e CMYK, trova il colore CSS con nome più simile e verifica il contrasto WCAG rispetto al bianco e al nero, tutto nel browser.
Creato da Justin Schuessler
Verifica del contrasto
Calcola in tempo reale il rapporto di contrasto WCAG tra due colori e verificalo rispetto ai criteri AA/AAA e ai componenti UI, direttamente nel browser.
Creato da Justin Schuessler
Simulatore di daltonismo
Simuli in tempo reale come vengono percepite palette di colori e immagini personali in caso di protanopia, deuteranopia, tritanopia e acromatopsia: tutto viene elaborato nel browser.
Creato da Justin Schuessler
Selettore colori da immagine
Ricavi il codice colore da un'immagine: contagocce con lente, HEX, RGB e HSL, palette dell'immagine e indicazioni sul contrasto. L'immagine resta nel browser.
Creato da Dimitri Heissler
FAQ
Domande frequenti su Generatore di palette cromatiche
Risposte brevi su palette cromatiche, armonia dei colori e questo strumento.
Imposta saturazione e luminosità nell'area colore, regola la tonalità con il cursore oppure inserisci un codice HEX o valori RGB. In alternativa, clicca su «Colore casuale». Tutti e sei gli schemi cromatici si aggiornano subito, senza pulsante di generazione. Ogni campione mostra HEX, RGB e HSL; con un clic copi il codice HEX.
Inserisci il tuo colore come codice HEX o valori RGB e consulta lo schema «Complementare»: mostra il tuo colore di base e quello opposto nel cerchio cromatico (tonalità ruotata di 180°). Il generatore usa il cerchio cromatico HSL degli schermi: il verde puro #00FF00 ha come complementare il magenta #FF00FF, mentre il blu puro #0000FF ha il giallo #FFFF00. Nel cerchio cromatico classico della pittura sarebbero rispettivamente il rosso e l'arancione.
Tre colori danno vita a tre dei sei schemi: triadico (tre tonalità distanziate di 120°, vivace ed equilibrato), analogo (il colore di base e i colori adiacenti a −30° e +30°, calmo e armonioso) e complementare diviso (il colore di base e i due colori adiacenti al suo complementare, ricco di contrasto ma con meno tensione visiva). Inserisci il tuo colore di base e confrontali fianco a fianco.
Uno schema cromatico monocromatico mantiene la stessa tonalità e saturazione, modificando solo la luminosità. Il generatore crea cinque livelli di luminosità, dallo scuro al chiaro, distinguibili anche con colori di base molto chiari o molto scuri. Il risultato è discreto e armonioso, adatto per esempio a sfondi e superfici.
Armonioso non significa automaticamente leggibile: le combinazioni più problematiche sono testo e sfondo con una differenza di luminosità insufficiente. Prima di usarla, verifica quindi la tua combinazione nello strumento di controllo del contrasto. Il link «Verifica contrasto» sotto gli schemi cromatici invia direttamente il tuo colore di base allo strumento.
La regola del 60-30-10 è una regola pratica del design: circa il 60 % di colore principale, il 30 % di colore secondario e il 10 % di colore d'accento. Il generatore non la applica automaticamente. Distribuisci tu i colori dello schema, per esempio usando il colore di base come principale e il complementare come accento.
Sì. Il colore di base compare automaticamente come parametro nell'URL, per esempio ?color=3b82f6. Copia l'indirizzo dalla barra degli indirizzi: chi apre il link vede lo stesso colore di base e gli stessi sei schemi cromatici. Non ti serve un account.
Il generatore di palette cromatiche è gratuito e non richiede la registrazione. Tutti i colori vengono calcolati nel tuo browser: la tua scelta non viene né salvata né inviata a un server. Se chiudi la scheda, puoi recuperare la palette solo tramite un link copiato in precedenza.
Hai altre domande?
Contatta il supportoCerchi un server per il tuo prossimo progetto?
Un VPS di ZAP-Hosting ti offre il pieno controllo sulla tua infrastruttura, con accesso SSH personale, firewall e accesso root completo.
Nessuna configurazione. Nessun rischio. Online in pochi secondi.
Cerchi altri strumenti? Visualizza tutti gli strumenti per immagini e design
Fonte preferita su Google
