#368EB5 - #006885 | 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 #368EB5 a #006885

#368EB5 #006885

Calcule el color entre dos colores, #368EB5 y #006885. 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)

#368EB5 - #006885 | 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 #368EB5 como 0% y #006885 como 100%.

0.0%	0.0% #368EB5	RGB 54 142 181	#368EB5
16.7%	16.7% #2D87AD	RGB 45 135 173	#2D87AD
33.3%	33.3% #2481A5	RGB 36 129 165	#2481A5
50.0%	50.0% #1B7B9D	RGB 27 123 157	#1B7B9D
66.7%	66.7% #127495	RGB 18 116 149	#127495
83.3%	83.3% #096E8D	RGB 9 110 141	#096E8D
100.0%	100.0% #006885	RGB 0 104 133	#006885

#368EB5 #2D87AD #2481A5 #1B7B9D #127495 #096E8D #006885

#368EB5 - #006885

Mezcla HSV

#368EB5 - #006885 | 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 #368EB5 como 0% y #006885 como 100%.

0.0%	0.0% #368EB5	RGB 54 142 181	#368EB5
16.7%	16.7% #2B87AD	RGB 43 135 173	#2B87AD
33.3%	33.3% #2080A5	RGB 32 128 165	#2080A5
50.0%	50.0% #17799D	RGB 23 121 157	#17799D
66.7%	66.7% #0E7395	RGB 14 115 149	#0E7395
83.3%	83.3% #076D8D	RGB 7 109 141	#076D8D
100.0%	100.0% #006885	RGB 0 104 133	#006885

#368EB5 #2B87AD #2080A5 #17799D #0E7395 #076D8D #006885

#368EB5 - #17799D - #006885

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #368EB5 0%, #17799D 50%, #006885 100%);
    background: -webkit-linear-gradient(top, #368EB5 0%, #17799D 50%, #006885 100%);
    background: linear-gradient(to bottom, #368EB5 0%, #17799D 50%, #006885 100%);
}
</style>