#248FB2 - #C0DFE9 | 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 #248FB2 a #C0DFE9

#248FB2 #C0DFE9

Calcule el color entre dos colores, #248FB2 y #C0DFE9. 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)

#248FB2 - #C0DFE9 | 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 #248FB2 como 0% y #C0DFE9 como 100%.

0.0%	0.0% #248FB2	RGB 36 143 178	#248FB2
16.7%	16.7% #3E9CBB	RGB 62 156 187	#3E9CBB
33.3%	33.3% #58A9C4	RGB 88 169 196	#58A9C4
50.0%	50.0% #72B7CD	RGB 114 183 205	#72B7CD
66.7%	66.7% #8CC4D6	RGB 140 196 214	#8CC4D6
83.3%	83.3% #A6D1DF	RGB 166 209 223	#A6D1DF
100.0%	100.0% #C0DFE9	RGB 192 223 233	#C0DFE9

#248FB2 #3E9CBB #58A9C4 #72B7CD #8CC4D6 #A6D1DF #C0DFE9

#248FB2 - #C0DFE9

Mezcla HSV

#248FB2 - #C0DFE9 | 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 #248FB2 como 0% y #C0DFE9 como 100%.

0.0%	0.0% #248EB2	RGB 36 142 178	#248EB2
16.7%	16.7% #399BBB	RGB 57 155 187	#399BBB
33.3%	33.3% #50A7C4	RGB 80 167 196	#50A7C4
50.0%	50.0% #69B4CD	RGB 105 180 205	#69B4CD
66.7%	66.7% #84C2D6	RGB 132 194 214	#84C2D6
83.3%	83.3% #A1D0DF	RGB 161 208 223	#A1D0DF
100.0%	100.0% #C0DFE9	RGB 192 223 233	#C0DFE9

#248EB2 #399BBB #50A7C4 #69B4CD #84C2D6 #A1D0DF #C0DFE9

#248FB2 - #69B4CD - #C0DFE9

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #248EB2 0%, #69B4CD 50%, #C0DFE9 100%);
    background: -webkit-linear-gradient(top, #248EB2 0%, #69B4CD 50%, #C0DFE9 100%);
    background: linear-gradient(to bottom, #248EB2 0%, #69B4CD 50%, #C0DFE9 100%);
}
</style>