#ABC6D1 - #587793 | 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 #ABC6D1 a #587793

#ABC6D1 #587793

Calcule el color entre dos colores, #ABC6D1 y #587793. 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)

#ABC6D1 - #587793 | 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 #ABC6D1 como 0% y #587793 como 100%.

0.0%	0.0% #ABC6D1	RGB 171 198 209	#ABC6D1
16.7%	16.7% #9DB8C6	RGB 157 184 198	#9DB8C6
33.3%	33.3% #8FABBC	RGB 143 171 188	#8FABBC
50.0%	50.0% #819EB2	RGB 129 158 178	#819EB2
66.7%	66.7% #7391A7	RGB 115 145 167	#7391A7
83.3%	83.3% #65849D	RGB 101 132 157	#65849D
100.0%	100.0% #587793	RGB 88 119 147	#587793

#ABC6D1 #9DB8C6 #8FABBC #819EB2 #7391A7 #65849D #587793

#ABC6D1 - #587793

Mezcla HSV

#ABC6D1 - #587793 | 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 #ABC6D1 como 0% y #587793 como 100%.

0.0%	0.0% #ABC6D1	RGB 171 198 209	#ABC6D1
16.7%	16.7% #9BB8C6	RGB 155 184 198	#9BB8C6
33.3%	33.3% #8CABBC	RGB 140 171 188	#8CABBC
50.0%	50.0% #7E9EB2	RGB 126 158 178	#7E9EB2
66.7%	66.7% #7090A7	RGB 112 144 167	#7090A7
83.3%	83.3% #63839D	RGB 99 131 157	#63839D
100.0%	100.0% #587793	RGB 88 119 147	#587793

#ABC6D1 #9BB8C6 #8CABBC #7E9EB2 #7090A7 #63839D #587793

#ABC6D1 - #7E9EB2 - #587793

Códigos CSS

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

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