#0076AA - #00677A | 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 #0076AA a #00677A

#0076AA #00677A

Calcule el color entre dos colores, #0076AA y #00677A. 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)

#0076AA - #00677A | 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 #0076AA como 0% y #00677A como 100%.

0.0%	0.0% #0076AA	RGB 0 118 170	#0076AA
16.7%	16.7% #0073A2	RGB 0 115 162	#0073A2
33.3%	33.3% #00719A	RGB 0 113 154	#00719A
50.0%	50.0% #006E92	RGB 0 110 146	#006E92
66.7%	66.7% #006C8A	RGB 0 108 138	#006C8A
83.3%	83.3% #006982	RGB 0 105 130	#006982
100.0%	100.0% #00677A	RGB 0 103 122	#00677A

#0076AA #0073A2 #00719A #006E92 #006C8A #006982 #00677A

#0076AA - #00677A

Mezcla HSV

#0076AA - #00677A | 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 #0076AA como 0% y #00677A como 100%.

0.0%	0.0% #0076AA	RGB 0 118 170	#0076AA
16.7%	16.7% #0074A2	RGB 0 116 162	#0074A2
33.3%	33.3% #00729A	RGB 0 114 154	#00729A
50.0%	50.0% #007092	RGB 0 112 146	#007092
66.7%	66.7% #006D8A	RGB 0 109 138	#006D8A
83.3%	83.3% #006A82	RGB 0 106 130	#006A82
100.0%	100.0% #00677A	RGB 0 103 122	#00677A

#0076AA #0074A2 #00729A #007092 #006D8A #006A82 #00677A

#0076AA - #007092 - #00677A

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #0076AA 0%, #007092 50%, #00677A 100%);
    background: -webkit-linear-gradient(top, #0076AA 0%, #007092 50%, #00677A 100%);
    background: linear-gradient(to bottom, #0076AA 0%, #007092 50%, #00677A 100%);
}
</style>