Färgblandare
Blanda två färger i valfri proportion i OKLab, OKLCH eller sRGB. Kopiera resultatet eller ett färdigt color-mix()-uttryck.
- HEX
- RGB
- OKLCH
CSS med reservvärde
color: #ae7ea4;
color: color-mix(in oklab, #ff5733, #3b82f6 50%);Steg från första till andra
Samma blandning i varje färgrymd
sRGB blir grått och mörkt i mitten. OKLab håller ljusheten jämn. OKLCH och HSL behåller mättnaden men vandrar runt färgcirkeln.
Frågor och svar
Vad är color-mix() i CSS?
color-mix() är en CSS-funktion som blandar två färger i en färgrymd du väljer, till exempel color-mix(in oklab, #ff5733, #3b82f6 30%). Den fungerar i alla aktuella webbläsare. Lägg en vanlig färg före den som reserv för äldre webbläsare, som i kodexemplet ovan.
Vilken färgrymd ska jag blanda i?
OKLab är det säkraste standardvalet: mitten behåller sin ljusstyrka och blir inte grumlig. OKLCH håller färgerna mättade men tar kortaste vägen runt färgcirkeln, så rött och blått passerar genom lila och rosa. sRGB är hur äldre verktyg blandar, och mitten ser ofta grå och mörk ut.
Varför skiljer sig blandning av ljus från blandning av målarfärg?
Skärmar adderar ljus, så det här verktyget tar medelvärdet av ljusvärden: blått och gult ger grått eller en blek färg, inte grönt. Målarfärg subtraherar ljus, och därför blir samma blandning grön på papper. Vill du förutsäga målarfärg behöver du en modell för färgblandning i stället för en färgrymd för skärm.