#5A87D9 - #A8C7E4 | 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 #5A87D9 a #A8C7E4

#5A87D9 #A8C7E4

Calcule el color entre dos colores, #5A87D9 y #A8C7E4. 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)

#5A87D9 - #A8C7E4 | 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 #5A87D9 como 0% y #A8C7E4 como 100%.

0.0%	0.0% #5A87D9	RGB 90 135 217	#5A87D9
16.7%	16.7% #6791DA	RGB 103 145 218	#6791DA
33.3%	33.3% #749CDC	RGB 116 156 220	#749CDC
50.0%	50.0% #81A7DE	RGB 129 167 222	#81A7DE
66.7%	66.7% #8EB1E0	RGB 142 177 224	#8EB1E0
83.3%	83.3% #9BBCE2	RGB 155 188 226	#9BBCE2
100.0%	100.0% #A8C7E4	RGB 168 199 228	#A8C7E4

#5A87D9 #6791DA #749CDC #81A7DE #8EB1E0 #9BBCE2 #A8C7E4

#5A87D9 - #A8C7E4

Mezcla HSV

#5A87D9 - #A8C7E4 | 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 #5A87D9 como 0% y #A8C7E4 como 100%.

0.0%	0.0% #5A87D9	RGB 90 135 217	#5A87D9
16.7%	16.7% #6692DA	RGB 102 146 218	#6692DA
33.3%	33.3% #739EDC	RGB 115 158 220	#739EDC
50.0%	50.0% #80A9DE	RGB 128 169 222	#80A9DE
66.7%	66.7% #8DB3E0	RGB 141 179 224	#8DB3E0
83.3%	83.3% #9ABDE2	RGB 154 189 226	#9ABDE2
100.0%	100.0% #A8C7E4	RGB 168 199 228	#A8C7E4

#5A87D9 #6692DA #739EDC #80A9DE #8DB3E0 #9ABDE2 #A8C7E4

#5A87D9 - #80A9DE - #A8C7E4

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5A87D9 0%, #80A9DE 50%, #A8C7E4 100%);
    background: -webkit-linear-gradient(top, #5A87D9 0%, #80A9DE 50%, #A8C7E4 100%);
    background: linear-gradient(to bottom, #5A87D9 0%, #80A9DE 50%, #A8C7E4 100%);
}
</style>