Generatore di schema quadrato

Inserendo un colore esadecimale, il generatore ne conserva saturazione e luminosità e produce la tonalità di base con tre colori coordinati ed equilibrati. Il risultato comprende valori esadecimali, RGB e HSL riutilizzabili in un design system, un foglio di stile, un progetto illustrato o uno studio del marchio. Il calcolo è deterministico: lo stesso input valido restituisce sempre la medesima palette ordinata, senza casualità né accesso alla rete.

Come si costruisce un’armonia cromatica quadrata

Un’armonia quadrata divide i 360 gradi della ruota cromatica in quattro parti uguali. Il colore inserito occupa il primo punto; il generatore aggiunge poi 90, 180 e 270 gradi alla sua tonalità. Saturazione e luminosità rimangono invariate, così la tonalità è l’unica componente che cambia e la relazione matematica della palette risulta evidente. Questo metodo è diverso da uno schema tetradico rettangolare, nel quale gli intervalli si alternano anziché restare uguali. Ogni campione restituito include lo spostamento esatto della tonalità, valori HSL normalizzati, canali RGB e un codice esadecimale minuscolo a sei cifre. La rotazione riparte correttamente dopo 360 gradi, quindi una base vicina alla fine della ruota si comporta come qualsiasi altro colore. Nei colori neutri, come il grigio, la saturazione HSL è zero e la rotazione della tonalità non produce differenze visibili: è una proprietà prevista del modello, non un errore. L’output comincia sempre dal colore base normalizzato e prosegue con le altre tre rotazioni.

Come scegliere e applicare i quattro colori

La distanza uniforme crea varietà, ma una buona gerarchia visiva dipende comunque dal ruolo assegnato a ogni colore. Lei può iniziare usando la base come colore dominante del marchio, dello sfondo o dell’illustrazione. Impieghi una tonalità ruotata per l’accento principale, un’altra per quello secondario e riservi il colore opposto agli elementi che richiedono una separazione netta. Poiché i quattro campioni condividono saturazione e luminosità, inizialmente hanno un peso visivo simile. In un’interfaccia completa, crei varianti più chiare e più scure dopo aver definito i ruoli, evitando che testo, bordi, riempimenti e stati interattivi competano allo stesso modo. Verifichi sempre il contrasto tra primo piano e sfondo: una relazione armonica non garantisce l’accessibilità. Il generatore offre un punto di partenza rigoroso, ma non impone uno spazio identico per ogni colore. Una distribuzione pratica assegna spesso la maggior parte della composizione a un colore, ne usa uno o due come supporto e riserva l’ultimo agli accenti.

Usare risultati deterministici nei flussi di design

Un output deterministico è importante quando una palette entra in un processo automatizzato. Un colore esadecimale di base memorizzato può rigenerare gli stessi quattro valori durante una compilazione, in uno script di design token o quando un cliente modifica un tema. La normalizzazione rende coerenti le forme abbreviate e le differenze tra maiuscole e minuscole, mentre gli array restituiti consentono di copiare i quattro codici o esaminare i dati strutturati. Poiché l’algoritmo usa conversioni HSL e spostamenti fissi, non classifica i colori in base al gusto, non deduce un’atmosfera e non modifica di nascosto i campioni. Questa trasparenza facilita verifica e riproduzione. Conservi il colore base insieme alla palette affinché i futuri collaboratori ne comprendano l’origine. Se in seguito modifica saturazione o luminosità per un ruolo specifico, mantenga il set quadrato originale come riferimento e documenti separatamente le varianti. Le richieste API costano $0.002, mentre la versione nel browser permette una rapida esplorazione manuale senza inviare altrove il colore.