#5DBECD - #D0ECF0 | 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 #5DBECD a #D0ECF0

#5DBECD #D0ECF0

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

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

0.0%	0.0% #5DBECD	RGB 93 190 205	#5DBECD
16.7%	16.7% #70C5D2	RGB 112 197 210	#70C5D2
33.3%	33.3% #83CDD8	RGB 131 205 216	#83CDD8
50.0%	50.0% #96D5DE	RGB 150 213 222	#96D5DE
66.7%	66.7% #A9DCE4	RGB 169 220 228	#A9DCE4
83.3%	83.3% #BCE4EA	RGB 188 228 234	#BCE4EA
100.0%	100.0% #D0ECF0	RGB 208 236 240	#D0ECF0

#5DBECD #70C5D2 #83CDD8 #96D5DE #A9DCE4 #BCE4EA #D0ECF0

#5DBECD - #D0ECF0

Mezcla HSV

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

0.0%	0.0% #5DBDCD	RGB 93 189 205	#5DBDCD
16.7%	16.7% #6EC5D2	RGB 110 197 210	#6EC5D2
33.3%	33.3% #80CDD8	RGB 128 205 216	#80CDD8
50.0%	50.0% #92D4DE	RGB 146 212 222	#92D4DE
66.7%	66.7% #A6DCE4	RGB 166 220 228	#A6DCE4
83.3%	83.3% #BAE4EA	RGB 186 228 234	#BAE4EA
100.0%	100.0% #D0ECF0	RGB 208 236 240	#D0ECF0

#5DBDCD #6EC5D2 #80CDD8 #92D4DE #A6DCE4 #BAE4EA #D0ECF0

#5DBECD - #92D4DE - #D0ECF0

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5DBDCD 0%, #92D4DE 50%, #D0ECF0 100%);
    background: -webkit-linear-gradient(top, #5DBDCD 0%, #92D4DE 50%, #D0ECF0 100%);
    background: linear-gradient(to bottom, #5DBDCD 0%, #92D4DE 50%, #D0ECF0 100%);
}
</style>