#ADE5E9 - #589FB8 | 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 #ADE5E9 a #589FB8

#ADE5E9 #589FB8

Calcule el color entre dos colores, #ADE5E9 y #589FB8. 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)

#ADE5E9 - #589FB8 | 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 #ADE5E9 como 0% y #589FB8 como 100%.

0.0%	0.0% #ADE5E9	RGB 173 229 233	#ADE5E9
16.7%	16.7% #9ED9E0	RGB 158 217 224	#9ED9E0
33.3%	33.3% #90CDD8	RGB 144 205 216	#90CDD8
50.0%	50.0% #82C2D0	RGB 130 194 208	#82C2D0
66.7%	66.7% #74B6C8	RGB 116 182 200	#74B6C8
83.3%	83.3% #66AAC0	RGB 102 170 192	#66AAC0
100.0%	100.0% #589FB8	RGB 88 159 184	#589FB8

#ADE5E9 #9ED9E0 #90CDD8 #82C2D0 #74B6C8 #66AAC0 #589FB8

#ADE5E9 - #589FB8

Mezcla HSV

#ADE5E9 - #589FB8 | 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 #ADE5E9 como 0% y #589FB8 como 100%.

0.0%	0.0% #ADE5E9	RGB 173 229 233	#ADE5E9
16.7%	16.7% #9DDAE0	RGB 157 218 224	#9DDAE0
33.3%	33.3% #8DCED8	RGB 141 206 216	#8DCED8
50.0%	50.0% #7FC3D0	RGB 127 195 208	#7FC3D0
66.7%	66.7% #71B7C8	RGB 113 183 200	#71B7C8
83.3%	83.3% #64ABC0	RGB 100 171 192	#64ABC0
100.0%	100.0% #589FB8	RGB 88 159 184	#589FB8

#ADE5E9 #9DDAE0 #8DCED8 #7FC3D0 #71B7C8 #64ABC0 #589FB8

#ADE5E9 - #7FC3D0 - #589FB8

Códigos CSS

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

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