Generatore di Sfumature e Tinte
Genera una scala completa di 11 gradazioni da qualsiasi colore hex. Esporta come variabili CSS, config Tailwind, SCSS o JSON.
:root {
--color-brand-50: #f7f5ff;
--color-brand-100: #ede8fe;
--color-brand-200: #dad2fc;
--color-brand-300: #beb3fa;
--color-brand-400: #998ff6;
--color-brand-500: #6366f1;
--color-brand-600: #4e52bc;
--color-brand-700: #3c408d;
--color-brand-800: #2d3269;
--color-brand-900: #21264a;
--color-brand-950: #191f38;
}Domande Frequenti
Qual è la differenza tra sfumatura e tinta?
Una sfumatura è un colore mescolato al nero (più scuro), una tinta è mescolata al bianco (più chiara).
Come uso le variabili CSS esportate?
Copia l'output del tab CSS e incollalo nel tuo file CSS globale. Riferiscile con var(--brand-500).
La scala è compatibile con Tailwind CSS?
Sì. Passa al tab Tailwind e copia l'oggetto colors in tailwind.config.js.