Cosa fa il generatore di palette di colori
Questo strumento prende un singolo colore di base e costruisce una scala completa di undici tinte e ombre attorno a esso, numerate da 50 (la piu chiara) a 950 (la piu scura). E lo stesso tipo di rampa di colore che vedi nei sistemi di design moderni, generata in pochi secondi invece di essere miscelata a mano. Aiuta gli sviluppatori front-end che hanno bisogno di una palette pronta per Tailwind, i designer che creano token per un marchio e chiunque abbia un solo colore preferito e voglia un intervallo coerente dal chiaro allo scuro che lo accompagni.
Come usarlo
- Scegli un colore di partenza con il selettore di colore, oppure digita un codice hex direttamente nel campo.
- Lo strumento costruisce all istante undici tonalita dal chiaro (50) allo scuro (950) a partire dal tuo colore di base.
- Fai clic su qualsiasi singolo campione per copiare quel codice hex negli appunti.
- Usa l azione copia tutto per prendere tutti i valori della scala in una volta.
- Incolla i codici nella configurazione di Tailwind, nel sistema di design o nel foglio di stile.
Un esempio rapido
Inserisci un blu di marca come #2563eb e ottieni una rampa completa da 50 a 950, da una tinta pallida per gli sfondi a un ombra profonda per testo e bordi. Tieni i passaggi piu chiari (da 50 a 200) per riempimenti e stati hover, il tuo colore di base intorno a 500 o 600 per i pulsanti, e i passaggi piu scuri per il contrasto. Tutto funziona nel tuo browser, resta privato senza alcun caricamento ed e completamente gratuito senza registrazione.
Domande frequenti
- Cosa significa la scala da 50 a 950?
- Quei numeri sono i passaggi standard della scala di colore usati dai sistemi di design come Tailwind. 50 e la tinta piu chiara e 950 e l ombra piu scura, con il tuo colore di base che si trova in un punto intermedio degli undici passaggi.
- Posso usare questi colori in Tailwind?
- Si. Gli undici valori corrispondono direttamente alle chiavi da 50 a 950 di Tailwind, quindi puoi incollarli direttamente nella configurazione del tema o in qualsiasi file di token di design.
- Come copio i colori?
- Fai clic su qualsiasi singolo campione per copiarne il codice hex, oppure usa l azione copia tutto per prendere l intera scala in una volta. Da li puoi incollarli ovunque siano accettati valori hex.