Mixer di colori
Mescola due colori in qualsiasi proporzione in OKLab, OKLCH o sRGB. Copia il risultato o un’espressione color-mix() pronta.
- HEX
- RGB
- OKLCH
CSS con fallback
color: #ae7ea4;
color: color-mix(in oklab, #ff5733, #3b82f6 50%);Passi dal primo al secondo
La stessa mescola in ogni spazio
sRGB diventa grigio e scuro al centro. OKLab mantiene uniforme la luminosità. OKLCH e HSL mantengono la saturazione ma girano attorno alla ruota delle tonalità.
Domande e risposte
Che cos’è color-mix() in CSS?
color-mix() è una funzione CSS che mescola due colori nello spazio colore che scegli, per esempio color-mix(in oklab, #ff5733, #3b82f6 30%). Funziona in tutti i browser attuali. Per quelli più vecchi, metti prima un colore semplice come fallback, come nello snippet qui sopra.
In quale spazio colore conviene mescolare?
OKLab è la scelta predefinita più sicura: il colore intermedio mantiene la sua luminosità e non diventa fangoso. OKLCH mantiene i colori saturi ma percorre la strada più breve sulla ruota delle tonalità, quindi tra rosso e blu passa per viola e rosa. sRGB è il modo in cui mescolano i vecchi strumenti, e il colore intermedio spesso risulta grigio e scuro.
Perché mescolare la luce è diverso dal mescolare la pittura?
Gli schermi sommano la luce, quindi questo strumento fa la media dei valori di luce: blu e giallo danno un grigio o un colore pallido, non il verde. La pittura invece sottrae luce, ed è per questo che la stessa miscela su carta appare verde. Per prevedere il risultato con i colori a tempera o a olio, usa un modello di miscelazione dei pigmenti invece di uno spazio colore per schermi.