Generatore di Palette di Colori
Il generatore di palette crea una palette di 5 colori partendo da qualsiasi colore base con le armonie della teoria del colore (complementare, triadica, analoga, complementare divisa, tetradica o monocromatica) e la esporta come proprietà personalizzate CSS.
Informazioni su questo strumento
Il generatore di palette crea una palette di 5 colori partendo da qualsiasi colore base con le armonie della teoria del colore (complementare, triadica, analoga, complementare divisa, tetradica o monocromatica) e la esporta come proprietà personalizzate CSS.
Come si usa
- Scegli un colore base con il selettore.
- Scegli un tipo di armonia, per esempio complementare o triadica.
- Guarda i cinque campioni generati.
- Clicca Copy as CSS Variables per incollare la palette nel tuo foglio di stile.
Da sapere
- I colori complementari si trovano a 180° l'uno dall'altro sulla ruota dei colori; quelli triadici sono distanziati di 120°.
- Le palette analoghe usano tonalità vicine (a circa 30° di distanza) e trasmettono un senso di calma e coerenza.
- La complementare divisa abbina una tonalità base alle due tonalità ai lati del suo complementare (±30°), offrendo contrasto con meno tensione.
- Le palette monocromatiche mantengono una sola tonalità e variano solo saturazione e luminosità.
- Il generatore lavora in HSL, che ruota la tonalità senza cambiare la luminosità del colore.
Funziona interamente nel tuo browser: nulla di ciò che inserisci viene caricato o salvato.
Domande frequenti
Cos'è una palette di colori complementari?
Una palette complementare abbina una tonalità a quella direttamente opposta sulla ruota dei colori (a 180°), come blu e arancione. È l'armonia con il contrasto più forte.
Quanti colori dovrebbe avere la palette di un sito?
La maggior parte delle interfacce usa un colore primario, uno o due colori di accento e una serie di neutri. Un'armonia di cinque colori è un buon punto di partenza, che puoi ridurre o ampliare con tinte e ombre.
Che differenza c'è tra triadica e tetradica?
La triadica usa tre tonalità distanziate in modo uniforme di 120°. La tetradica usa quattro tonalità distanziate di 90°, formando un quadrato sulla ruota: è più ricca ma più difficile da bilanciare.
Posso usare la palette in CSS o Tailwind?
Sì. Copia la palette come proprietà personalizzate CSS e richiamale con var(), oppure incolla i valori esadecimali nei colori del tema Tailwind.