#0077A1 - #00666F | 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 #0077A1 a #00666F

#0077A1 #00666F

Calcule el color entre dos colores, #0077A1 y #00666F. 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)

#0077A1 - #00666F | 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 #0077A1 como 0% y #00666F como 100%.

0.0%	0.0% #0077A1	RGB 0 119 161	#0077A1
16.7%	16.7% #007498	RGB 0 116 152	#007498
33.3%	33.3% #007190	RGB 0 113 144	#007190
50.0%	50.0% #006E88	RGB 0 110 136	#006E88
66.7%	66.7% #006B7F	RGB 0 107 127	#006B7F
83.3%	83.3% #006877	RGB 0 104 119	#006877
100.0%	100.0% #00666F	RGB 0 102 111	#00666F

#0077A1 #007498 #007190 #006E88 #006B7F #006877 #00666F

#0077A1 - #00666F

Mezcla HSV

#0077A1 - #00666F | 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 #0077A1 como 0% y #00666F como 100%.

0.0%	0.0% #0077A1	RGB 0 119 161	#0077A1
16.7%	16.7% #007598	RGB 0 117 152	#007598
33.3%	33.3% #007390	RGB 0 115 144	#007390
50.0%	50.0% #007088	RGB 0 112 136	#007088
66.7%	66.7% #006D7F	RGB 0 109 127	#006D7F
83.3%	83.3% #006A77	RGB 0 106 119	#006A77
100.0%	100.0% #00666F	RGB 0 102 111	#00666F

#0077A1 #007598 #007390 #007088 #006D7F #006A77 #00666F

#0077A1 - #007088 - #00666F

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #0077A1 0%, #007088 50%, #00666F 100%);
    background: -webkit-linear-gradient(top, #0077A1 0%, #007088 50%, #00666F 100%);
    background: linear-gradient(to bottom, #0077A1 0%, #007088 50%, #00666F 100%);
}
</style>