#ABC6CF - #5A7691 | colorate

colorate es una herramienta de esquema de color para diseñadores y desarrolladores. Esta ayudará a inspirarse y servirá de recurso para su trabajo de color. Haz que este sitio sea mejor

Mezcla #ABC6CF a #5A7691

#ABC6CF #5A7691

Calcule el color entre dos colores, #ABC6CF y #5A7691. En el cálculo de los valores RGB, la saturación entre los colores diferentes es baja. Al calcular los valores de HSV, la saturación entre los diferentes colores no es baja.

Mezcla RGB (Linear)

#ABC6CF - #5A7691 | colorate

Cálculo del color entre dos colores según el valor RGB. Para colores que están distantes entre sí, la saturación entre los dos colores disminuye. Expande el color entre dos colores con #ABC6CF como 0% y #5A7691 como 100%.

0.0%	0.0% #ABC6CF	RGB 171 198 207	#ABC6CF
16.7%	16.7% #9DB8C4	RGB 157 184 196	#9DB8C4
33.3%	33.3% #90ABBA	RGB 144 171 186	#90ABBA
50.0%	50.0% #829EB0	RGB 130 158 176	#829EB0
66.7%	66.7% #7590A5	RGB 117 144 165	#7590A5
83.3%	83.3% #67839B	RGB 103 131 155	#67839B
100.0%	100.0% #5A7691	RGB 90 118 145	#5A7691

#ABC6CF #9DB8C4 #90ABBA #829EB0 #7590A5 #67839B #5A7691

#ABC6CF - #5A7691

Mezcla HSV

#ABC6CF - #5A7691 | colorate

Cálculo del color entre dos colores según el valor de HSV. Incluso entre distintos colores de color, la saturación entre los dos colores no disminuye. Expande el color entre dos colores con #ABC6CF como 0% y #5A7691 como 100%.

0.0%	0.0% #ABC6CF	RGB 171 198 207	#ABC6CF
16.7%	16.7% #9BB8C4	RGB 155 184 196	#9BB8C4
33.3%	33.3% #8DABBA	RGB 141 171 186	#8DABBA
50.0%	50.0% #7F9DB0	RGB 127 157 176	#7F9DB0
66.7%	66.7% #7290A5	RGB 114 144 165	#7290A5
83.3%	83.3% #65839B	RGB 101 131 155	#65839B
100.0%	100.0% #5A7691	RGB 90 118 145	#5A7691

#ABC6CF #9BB8C4 #8DABBA #7F9DB0 #7290A5 #65839B #5A7691

#ABC6CF - #7F9DB0 - #5A7691

Códigos CSS

<style type="text/css">
/* RGB Gradient */
div {
    background: -moz-linear-gradient(top, #ABC6CF 0%, #5A7691 100%);
    background: -webkit-linear-gradient(top, #ABC6CF 0%, #5A7691 100%);
    background: linear-gradient(to bottom, #ABC6CF 0%, #5A7691 100%);
}

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #ABC6CF 0%, #7F9DB0 50%, #5A7691 100%);
    background: -webkit-linear-gradient(top, #ABC6CF 0%, #7F9DB0 50%, #5A7691 100%);
    background: linear-gradient(to bottom, #ABC6CF 0%, #7F9DB0 50%, #5A7691 100%);
}
</style>