#3687B5 - #ADCED0 | 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 #3687B5 a #ADCED0

#3687B5 #ADCED0

Calcule el color entre dos colores, #3687B5 y #ADCED0. 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)

#3687B5 - #ADCED0 | 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 #3687B5 como 0% y #ADCED0 como 100%.

0.0%	0.0% #3687B5	RGB 54 135 181	#3687B5
16.7%	16.7% #4992B9	RGB 73 146 185	#4992B9
33.3%	33.3% #5D9EBE	RGB 93 158 190	#5D9EBE
50.0%	50.0% #71AAC2	RGB 113 170 194	#71AAC2
66.7%	66.7% #85B6C7	RGB 133 182 199	#85B6C7
83.3%	83.3% #99C2CB	RGB 153 194 203	#99C2CB
100.0%	100.0% #ADCED0	RGB 173 206 208	#ADCED0

#3687B5 #4992B9 #5D9EBE #71AAC2 #85B6C7 #99C2CB #ADCED0

#3687B5 - #ADCED0

Mezcla HSV

#3687B5 - #ADCED0 | 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 #3687B5 como 0% y #ADCED0 como 100%.

0.0%	0.0% #3686B5	RGB 54 134 181	#3686B5
16.7%	16.7% #4796B9	RGB 71 150 185	#4796B9
33.3%	33.3% #5AA4BE	RGB 90 164 190	#5AA4BE
50.0%	50.0% #6DB0C2	RGB 109 176 194	#6DB0C2
66.7%	66.7% #82BCC7	RGB 130 188 199	#82BCC7
83.3%	83.3% #97C5CB	RGB 151 197 203	#97C5CB
100.0%	100.0% #ADCED0	RGB 173 206 208	#ADCED0

#3686B5 #4796B9 #5AA4BE #6DB0C2 #82BCC7 #97C5CB #ADCED0

#3687B5 - #6DB0C2 - #ADCED0

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3686B5 0%, #6DB0C2 50%, #ADCED0 100%);
    background: -webkit-linear-gradient(top, #3686B5 0%, #6DB0C2 50%, #ADCED0 100%);
    background: linear-gradient(to bottom, #3686B5 0%, #6DB0C2 50%, #ADCED0 100%);
}
</style>