#8FA5E4 - #3451A8 | 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 #8FA5E4 a #3451A8

#8FA5E4 #3451A8

Calcule el color entre dos colores, #8FA5E4 y #3451A8. 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)

#8FA5E4 - #3451A8 | 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 #8FA5E4 como 0% y #3451A8 como 100%.

0.0%	0.0% #8FA5E4	RGB 143 165 228	#8FA5E4
16.7%	16.7% #7F97DA	RGB 127 151 218	#7F97DA
33.3%	33.3% #7089D0	RGB 112 137 208	#7089D0
50.0%	50.0% #617BC6	RGB 97 123 198	#617BC6
66.7%	66.7% #526DBC	RGB 82 109 188	#526DBC
83.3%	83.3% #435FB2	RGB 67 95 178	#435FB2
100.0%	100.0% #3451A8	RGB 52 81 168	#3451A8

#8FA5E4 #7F97DA #7089D0 #617BC6 #526DBC #435FB2 #3451A8

#8FA5E4 - #3451A8

Mezcla HSV

#8FA5E4 - #3451A8 | 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 #8FA5E4 como 0% y #3451A8 como 100%.

0.0%	0.0% #8FA5E4	RGB 143 165 228	#8FA5E4
16.7%	16.7% #7D95DA	RGB 125 149 218	#7D95DA
33.3%	33.3% #6C85D0	RGB 108 133 208	#6C85D0
50.0%	50.0% #5C77C6	RGB 92 119 198	#5C77C6
66.7%	66.7% #4E69BC	RGB 78 105 188	#4E69BC
83.3%	83.3% #405DB2	RGB 64 93 178	#405DB2
100.0%	100.0% #3451A8	RGB 52 81 168	#3451A8

#8FA5E4 #7D95DA #6C85D0 #5C77C6 #4E69BC #405DB2 #3451A8

#8FA5E4 - #5C77C6 - #3451A8

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #8FA5E4 0%, #5C77C6 50%, #3451A8 100%);
    background: -webkit-linear-gradient(top, #8FA5E4 0%, #5C77C6 50%, #3451A8 100%);
    background: linear-gradient(to bottom, #8FA5E4 0%, #5C77C6 50%, #3451A8 100%);
}
</style>