#3C7DB3 - #559DFE | 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 #3C7DB3 a #559DFE

#3C7DB3 #559DFE

Calcule el color entre dos colores, #3C7DB3 y #559DFE. 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)

#3C7DB3 - #559DFE | 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 #3C7DB3 como 0% y #559DFE como 100%.

0.0%	0.0% #3C7DB3	RGB 60 125 179	#3C7DB3
16.7%	16.7% #4082BF	RGB 64 130 191	#4082BF
33.3%	33.3% #4487CC	RGB 68 135 204	#4487CC
50.0%	50.0% #488DD8	RGB 72 141 216	#488DD8
66.7%	66.7% #4C92E5	RGB 76 146 229	#4C92E5
83.3%	83.3% #5097F1	RGB 80 151 241	#5097F1
100.0%	100.0% #559DFE	RGB 85 157 254	#559DFE

#3C7DB3 #4082BF #4487CC #488DD8 #4C92E5 #5097F1 #559DFE

#3C7DB3 - #559DFE

Mezcla HSV

#3C7DB3 - #559DFE | 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 #3C7DB3 como 0% y #559DFE como 100%.

0.0%	0.0% #3C7DB3	RGB 60 125 179	#3C7DB3
16.7%	16.7% #4083BF	RGB 64 131 191	#4083BF
33.3%	33.3% #4489CC	RGB 68 137 204	#4489CC
50.0%	50.0% #488ED8	RGB 72 142 216	#488ED8
66.7%	66.7% #4C93E5	RGB 76 147 229	#4C93E5
83.3%	83.3% #5098F1	RGB 80 152 241	#5098F1
100.0%	100.0% #559DFE	RGB 85 157 254	#559DFE

#3C7DB3 #4083BF #4489CC #488ED8 #4C93E5 #5098F1 #559DFE

#3C7DB3 - #488ED8 - #559DFE

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C7DB3 0%, #488ED8 50%, #559DFE 100%);
    background: -webkit-linear-gradient(top, #3C7DB3 0%, #488ED8 50%, #559DFE 100%);
    background: linear-gradient(to bottom, #3C7DB3 0%, #488ED8 50%, #559DFE 100%);
}
</style>