In questo articolo
Cosa sono sfumature, tinte e toni del colore?
Una sfumatura si produce mescolando un colore con il nero, rendendolo più scuro. Una tinta si produce mescolando con il bianco. Un tono si produce mescolando con il grigio. Queste tre operazioni creano una palette completa da un singolo colore base.
Comprendere la differenza tra sfumature, tinte e toni è fondamentale per la teoria del colore. I designer usano queste variazioni per creare profondità, gerarchia e contrasto visivo.
Come funziona la generazione di sfumature
Un generatore di sfumature prende un colore base (come #3b82f6) e produce varianti più chiare e scure manipolando la luminosità in HSL.
- Manipolazione HSL — regola il valore L mantenendo H e S costanti
- Calcolo dei passaggi — l'intervallo viene diviso in step uniformi
- Miscelazione colori — alcuni generatori mescolano con bianco/nero/grigio
Prova gratuitamente — nessuna registrazione richiesta
Genera sfumature colore →Quando generare sfumature
Le palette di sfumature sono essenziali per design coerenti.
- Design system — genera una scala completa (50-950) dal colore primario del brand
- Tematizzazione UI — crea stati hover, attivo, focus e disabilitato
- Contrasto accessibilità — testa combinazioni contro i rapporti WCAG
Domande frequenti
Qual è la differenza tra sfumatura e tinta?
Una sfumatura è mescolata con il nero (più scura), una tinta con il bianco (più chiara).
Quante sfumature servono per un design system?
La maggior parte usa 10 step (50-950) seguendo la convenzione Tailwind CSS.
Posso generare combinazioni accessibili?
Sì. Generando una palette completa si possono testare le coppie contro i requisiti WCAG.