#3C80A8 - #B0C8C7 | 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 #3C80A8 a #B0C8C7

#3C80A8 #B0C8C7

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

#3C80A8 - #B0C8C7 | 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 #3C80A8 como 0% y #B0C8C7 como 100%.

0.0%	0.0% #3C80A8	RGB 60 128 168	#3C80A8
16.7%	16.7% #4F8CAD	RGB 79 140 173	#4F8CAD
33.3%	33.3% #6298B2	RGB 98 152 178	#6298B2
50.0%	50.0% #76A4B7	RGB 118 164 183	#76A4B7
66.7%	66.7% #89B0BC	RGB 137 176 188	#89B0BC
83.3%	83.3% #9CBCC1	RGB 156 188 193	#9CBCC1
100.0%	100.0% #B0C8C7	RGB 176 200 199	#B0C8C7

#3C80A8 #4F8CAD #6298B2 #76A4B7 #89B0BC #9CBCC1 #B0C8C7

#3C80A8 - #B0C8C7

Mezcla HSV

#3C80A8 - #B0C8C7 | 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 #3C80A8 como 0% y #B0C8C7 como 100%.

0.0%	0.0% #3C7FA8	RGB 60 127 168	#3C7FA8
16.7%	16.7% #4D90AD	RGB 77 144 173	#4D90AD
33.3%	33.3% #5E9FB2	RGB 94 159 178	#5E9FB2
50.0%	50.0% #71ACB8	RGB 113 172 184	#71ACB8
66.7%	66.7% #85B8BD	RGB 133 184 189	#85B8BD
83.3%	83.3% #9AC1C2	RGB 154 193 194	#9AC1C2
100.0%	100.0% #B0C8C7	RGB 176 200 199	#B0C8C7

#3C7FA8 #4D90AD #5E9FB2 #71ACB8 #85B8BD #9AC1C2 #B0C8C7

#3C80A8 - #71ACB8 - #B0C8C7

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C7FA8 0%, #71ACB8 50%, #B0C8C7 100%);
    background: -webkit-linear-gradient(top, #3C7FA8 0%, #71ACB8 50%, #B0C8C7 100%);
    background: linear-gradient(to bottom, #3C7FA8 0%, #71ACB8 50%, #B0C8C7 100%);
}
</style>