01
sRGB
#A7518DExaminar alternativa ↗
color-mix(in srgb, #FF5C35 50%, #4F46E5 50%)← Volver al catálogo de colores
Banco de comparación de interpolación
Mezcla dos colores. Obtén cuatro respuestas.
Aplica la misma proporción a cuatro espacios CSS. Compara cada resultado en una sola escala y copia color-mix() con una alternativa sRGB de seis dígitos.
01 / Cuatro recorridos de interpolación
Una proporción, cuatro resultados.
El marcador vertical cruza todas las escalas en el mismo porcentaje. El cambio procede del espacio de interpolación, no de otros valores de entrada.
02
sRGB lineal
#C252ABExaminar alternativa ↗
color-mix(in srgb-linear, #FF5C35 50%, #4F46E5 50%)03
OKLab
#A6659FExaminar alternativa ↗
color-mix(in oklab, #FF5C35 50%, #4F46E5 50%)04
OKLCH · arco de tono corto
#C939B0Examinar alternativa ↗
color-mix(in oklch, #FF5C35 50%, #4F46E5 50%)02 / Por qué cambia el punto medio
Mezclar color implica elegir coordenadas.
La interpolación digital no es una mezcla física de pintura. Cada espacio traza un camino diferente entre los mismos extremos, y el punto medio puede resultar más claro, oscuro, apagado o vivo.
Codificación frente a luz lineal
sRGB mezcla valores de canal codificados; sRGB lineal mezcla luz. Sus resultados al 50 % pueden diferir mucho, sobre todo entre negro y blanco.
Recorridos perceptuales
OKLab interpola coordenadas perceptuales rectangulares. OKLCH interpola luminosidad, croma y el arco de tono más corto, que puede conservar un recorrido más colorido.
Primero la alternativa
El fragmento copiado sitúa una alternativa sRGB de seis dígitos antes de color-mix(). Los navegadores compatibles aplican la segunda declaración.
03 / Método y fuente
Matemática de color CSS determinista.
Los colores sRGB opacos se convierten e interpolan según CSS Color. Los resultados OKLab y OKLCH fuera de gama se adaptan a sRGB. La apariencia también depende de la pantalla, la gestión del color, los colores cercanos y el componente final.