Generatore di Palette di Colori

Genera palette da un solo colore di partenza

Un valido generatore di palette trasforma un singolo colore in un piccolo insieme di scelte correlate che puoi davvero provare in un progetto. Invece di scegliere campioni a caso, questo strumento usa le classiche relazioni della ruota dei colori e regolazioni di luminosità in HSL. Scegli un colore base, seleziona un'armonia e la palette si aggiorna subito con valori HEX copiabili. È abbastanza rapido per l'esplorazione e abbastanza prevedibile da poter essere documentato come design token una volta rifinito il risultato.

Il generatore funziona interamente nel tuo browser, quindi è sicuro per colori di brand non ancora rilasciati, moodboard dei clienti e temi interni di prodotto. Non ci sono caricamenti, account o servizi di palette esterni. Il calcolo è deterministico: lo stesso colore base e la stessa armonia producono gli stessi campioni, così è facile rivedere una palette in seguito o confrontare più direzioni durante una revisione del design.

Scegliere l'armonia giusta

Le palette complementari abbinano un colore alla tinta opposta sulla ruota dei colori. Creano un forte contrasto e sono utili per call to action, grafici o accenti che devono distinguersi. Le palette analoghe usano tinte vicine, che di solito risultano più calme e coese: sono adatte a sfondi, illustrazioni e temi di prodotto più morbidi. Le palette triadiche distribuiscono le tinte in modo uniforme sulla ruota, offrendo varietà senza affidarsi a un unico colore opposto dominante. Le palette monocromatiche mantengono stabile la tinta e variano la luminosità, ideale per stati dell'interfaccia, card, bordi e superfici sottili.

Dai colori generati a un design system funzionante

Le palette generate sono un punto di partenza, non un sostituto dei test. Copia i colori nella tua interfaccia reale e verifica come si comportano con testo, icone, ombre e superfici adiacenti. Alcuni colori che appaiono equilibrati come campioni possono risultare troppo invadenti su aree ampie o troppo deboli su controlli piccoli. Dopo aver scelto una direzione, usa il verificatore di contrasto per garantire la leggibilità del testo e valuta di nominare i colori finali in base allo scopo, come primario, accento, superficie o avviso, anziché solo in base alla tinta. I nomi basati sullo scopo semplificano i futuri restyling perché il codice comunica l'intento.