Generatore di Tinte e Sfumature

Informazioni su questo strumento

Il generatore di tinte e ombre crea varianti piu chiare e piu scure da qualsiasi colore base. Le tinte si ottengono mescolando il colore base con il bianco (aggiungendo luminosita), mentre le ombre si ottengono mescolando con il nero (riducendo la luminosita).

Lo strumento genera fino a 5 livelli di tinte e 5 di ombre, piu il colore base originale, fornendo una tavolozza di 11 passi centrata sulla tinta scelta. Clicca su un campione per copiare il suo codice hex.

Come usare

1. Scegli un colore base usando il selettore o digita un codice hex.
2. Usa i pulsanti campione per provare rapidamente i colori predefiniti.
3. Regola il numero di livelli (3-5) per controllare la larghezza della tavolozza.
4. Clicca su un campione per copiare il codice hex. Usa Copia tutto per la scala completa.

Casi d'uso

I sistemi di design richiedono una scala cromatica sistematica per ogni colore del brand. I designer UI generano stati hover, attivo e disabilitato da un singolo colore di azione. Gli sviluppatori frontend creano varianti di colore coerenti.

Domande frequenti

• Qual e la differenza tra tinta e ombra? — Una tinta mescola il colore con il bianco (piu chiaro); un'ombra mescola con il nero (piu scuro). Un tono mescola con il grigio e non viene generato qui.
• Come vengono calcolati i livelli? — Ogni livello mescola il colore base con bianco o nero nelle proporzioni di 10%, 30%, 50%, 70% e 90%, fornendo passi visivi coerenti.
• Posso ottenere variabili CSS da questo? — L'output sono codici hex. Puoi incollarli nel tuo CSS come --color-500, --color-400, ecc.