Come funziona la generazione delle palette
Scegli un colore di base tramite il selettore o inserendo il codice. Il generatore utilizza il modello HSL (Hue, Saturation, Lightness) per calcolare rapidamente cinque tipi di palette: complementare, analoga, triadica, tetradica e sfumature. Ogni palette viene creata ruotando il valore di hue (tonalità) secondo angoli specifici, e regolando la luminosità per le sfumature.
Tutto avviene localmente nel browser, garantendo velocità e privacy. Non serve installare software né caricare dati: le palette sono subito pronte ed esportabili come variabili CSS.
Tipi di palette e quando usarle
Le palette complementari offrono contrasti decisi, utili per elementi che devono risaltare. Quelle analoghe garantiscono armonia, ideale per sfondi o interfacce rilassanti. Triadiche e tetradiche combinano tre o quattro colori equidistanti sulla ruota cromatica, ottime per progetti dinamici o che richiedono varietà senza perdere coerenza. Le sfumature servono per gradienti o per gestire diversi livelli di profondità visiva.
La scelta dipende dall’effetto desiderato: per un brand fortemente riconoscibile conviene partire da analoghe, mentre per CTA e messaggi di errore un colore complementare offre maggiore impatto.
Esportazione e integrazione nei progetti
Una volta generata la palette, puoi esportarla come variabili CSS personalizzate, pronte per essere inserite nei tuoi fogli di stile. Basta un click per copiare tutti i colori o singole tinte direttamente dalla pagina.
Ricorda che il generatore non verifica i rapporti di contrasto: se vuoi garantire l’accessibilità, controlla manualmente i colori scelti, soprattutto per testi su sfondi chiari o scuri. Tutte le operazioni avvengono localmente, senza invio dati.
Domande frequenti
Come scelgo il tipo di palette più adatto al mio progetto?
Ogni palette ha caratteristiche precise: analoghe per armonia, complementari per contrasto, triadiche e tetradiche per varietà. Considera lo stile e il messaggio della tua interfaccia: per ambienti tranquilli preferisci palette analoghe, per elementi di rilievo usa complementari.
I colori generati funzionano bene insieme nell’interfaccia?
Le palette sono costruite matematicamente per armonizzare, ma la percezione può variare a seconda del contesto. È consigliato testare le combinazioni in una UI reale, soprattutto per elementi importanti o interattivi.
Come verifico che i colori rispettino gli standard di accessibilità?
Il generatore non valuta il contrasto, quindi controlla manualmente i rapporti tra testo e sfondo usando strumenti come il contrast checker. Scegli colori con buona luminosità e saturazione per garantire leggibilità.
Posso personalizzare il numero di colori o gli angoli di generazione?
No, il generatore produce palette fisse basate su rotazioni standard della ruota cromatica. Non è possibile modificare il numero di colori o gli angoli direttamente dall’interfaccia.
Cosa succede se inserisco un colore con saturazione o luminosità molto basse?
Colori con saturazione o luminosità basse generano palette meno vivaci o quasi grigie, che potrebbero non distinguersi bene tra loro. Per risultati migliori usa colori più saturi e luminosi.
Posso vedere un’anteprima della palette in una UI esempio?
Il tool mostra la palette visivamente, ma non offre anteprime in contesti di interfaccia reali. Puoi comunque copiare facilmente i colori ed applicarli a tuoi prototipi.
Qualcosa non va o hai un'idea per questo strumento? Scrivici