:root {
--color-100: #d0d9fb;
--color-200: #8aa0f4;
--color-300: #4466ee;
--color-400: #4466ee;
--color-500: #0f2da3;
--color-600: #0a1c67;
--color-700: #050f38;
}Il generatore di tavolozza dei colori trasforma un singolo colore di base in un insieme coordinato di colori utilizzando le regole di armonia con la ruota dei colori. Scegli un colore iniziale e scegli una modalità - sfumature e tinte, monocromatica, complementare, analoga, triadica o tetradica - e lo strumento calcola una tavolozza bilanciata con il valore esadecimale, RGB e HSL per ogni campione.
Buone combinazioni di colori seguono le relazioni prevedibili sulla ruota dei colori HSL: i colori complementari si trovano uno di fronte all'altro, i colori analoghi si trovano uno accanto all'altro e i colori triadici sono equamente distanziati. Lavorare a mano significa giocoleria con angoli di tonalità e valori di leggerezza. Questo strumento esegue istantaneamente la matematica e mostra il risultato in modo da poter scegliere uno schema che funzioni.
Tutto funziona nel tuo browser. Regola il colore di base, cambia modalità , fai clic su qualsiasi campione per copiarne il valore o esporta l'intera tavolozza come proprietà personalizzate CSS. Nessun account, nessun caricamento e continua a funzionare offline una volta caricata la pagina.
Utilizzare il selettore di colori o digitare un valore esadecimale per impostare il colore su cui si basa la tavolozza.
Passa da sfumature e tinte, monocromatico, complementare, analogo, triadico e tetradico per vedere diversi schemi coordinati.
Ogni campione mostra il suo valore esadecimale, RGB e HSL. Fare clic su un campione per copiarlo o copiare l'intera tavolozza come proprietà personalizzate CSS.
Utilizza i colori generati per sfondi, accenti e testo nel tuo disegno o foglio di stile, mantenendo l'armonia coerente in tutta la tua interfaccia utente.
Sfumature e tinte, schemi monocromatici, complementari, analoghi, triadici e tetradici coprono ogni relazione di colore comune
Ogni campione mostra tutti e tre i formati, in modo da poter inserire il giusto valore direttamente in CSS, strumenti di progettazione o codice
Esporta l'intera tavolozza come: root proprietà personalizzate, pronte per incollare nel foglio di stile come scala del token di progettazione
Le armonie sono calcolate in HSL, quindi le tonalità rimangono equamente distanziate e i passaggi di leggerezza sembrano equilibrati, non fangosi
Pick colors and convert between HEX, RGB, and HSL formats
Check the contrast ratio between a text color and its background against WCAG 2.2 AA and AAA thresholds, with a live preview and one-click accessible-color suggestions.
Create beautiful CSS gradients with live preview
0 comments
No comments yet. Be the first to share your thoughts!