Input colore
Scegli o inserisci un colore
Colore valido.
Strumento di web design
Selettore colore
Scegli un colore con il selettore nativo, HEX o controlli RGB precisi; copia i formati, esplora le armonie, esamina tinte e ombre e scegli testo leggibile.
Anteprima dal vivo
Valori del colore
Copia i codici colore
HEX#16735F
RGBrgb(22, 115, 95)
HSLhsl(167.1, 67.9%, 26.9%)
HSVhsv(167.1, 80.9%, 45.1%)
Stima CMYKcmyk(80.9%, 0%, 17.4%, 54.9%)
Variabile CSS--color: #16735F;
Accessibilità
Contrasto del testo
Testo di esempio sul colore selezionato
Testo bianco5.48:1
Testo nero3.83:1
Colore del testo consigliatoUsa testo bianco.
Luminanza relativa0.142
I rapporti usano la luminanza relativa WCAG. Il testo normale richiede 4,5:1 per AA e 7:1 per AAA; il testo grande richiede 3:1 per AA.
Armonia dei colori
Palette generata
Scegli una modalità di armonia, quindi seleziona un campione per renderlo il nuovo colore di base.
Scala colore
Tinte e ombre
Tinte
Ombre
Le tinte si avvicinano al bianco e le ombre al nero, mantenendo tonalità e saturazione selezionate.
Note sul selettore colore
HEXHEX è compatto e adatto a CSS, design token e specifiche condivise.
RGBRGB controlla direttamente i canali rosso, verde e blu per browser e canvas.
HSLHSL separa tonalità, saturazione e luminosità, facilitando la creazione di colori di interfaccia correlati.
WCAGI rapporti di contrasto WCAG aiutano a scegliere testo nero o bianco leggibile sullo sfondo selezionato.
Domande frequenti
Posso usarlo come selettore di colore HEX?
Sì. Usa il selettore nativo o inserisci un HEX rigoroso di tre o sei cifre, quindi copia HEX, RGB, HSL, HSV, la stima CMYK o una variabile CSS.
Il contagocce funziona in ogni browser?
No. Il pulsante usa l'API EyeDropper quando disponibile e mostra un messaggio chiaro se non è supportata o la selezione viene annullata.
Come vengono generati i colori della palette?
Le palette complementare, analoga, triadica, complementare divisa, tetradica e monocromatica sono calcolate localmente dai valori HSL del colore scelto.
Quale rapporto di contrasto deve raggiungere il testo?
WCAG AA richiede 4,5:1 per il testo normale e 3:1 per il testo grande. AAA richiede 7:1 per il testo normale.