#0080BB - #163D5E | 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 #0080BB a #163D5E

#0080BB #163D5E

Calcule el color entre dos colores, #0080BB y #163D5E. 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)

#0080BB - #163D5E | 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 #0080BB como 0% y #163D5E como 100%.

0.0%	0.0% #0080BB	RGB 0 128 187	#0080BB
16.7%	16.7% #0374AB	RGB 3 116 171	#0374AB
33.3%	33.3% #07699C	RGB 7 105 156	#07699C
50.0%	50.0% #0B5E8C	RGB 11 94 140	#0B5E8C
66.7%	66.7% #0E537D	RGB 14 83 125	#0E537D
83.3%	83.3% #12486D	RGB 18 72 109	#12486D
100.0%	100.0% #163D5E	RGB 22 61 94	#163D5E

#0080BB #0374AB #07699C #0B5E8C #0E537D #12486D #163D5E

#0080BB - #163D5E

Mezcla HSV

#0080BB - #163D5E | 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 #0080BB como 0% y #163D5E como 100%.

0.0%	0.0% #0080BB	RGB 0 128 187	#0080BB
16.7%	16.7% #0673AB	RGB 6 115 171	#0673AB
33.3%	33.3% #0C679C	RGB 12 103 156	#0C679C
50.0%	50.0% #105C8C	RGB 16 92 140	#105C8C
66.7%	66.7% #13517D	RGB 19 81 125	#13517D
83.3%	83.3% #15476D	RGB 21 71 109	#15476D
100.0%	100.0% #163D5E	RGB 22 61 94	#163D5E

#0080BB #0673AB #0C679C #105C8C #13517D #15476D #163D5E

#0080BB - #105C8C - #163D5E

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #0080BB 0%, #105C8C 50%, #163D5E 100%);
    background: -webkit-linear-gradient(top, #0080BB 0%, #105C8C 50%, #163D5E 100%);
    background: linear-gradient(to bottom, #0080BB 0%, #105C8C 50%, #163D5E 100%);
}
</style>