#336B6B - #8CB486 | 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 #336B6B a #8CB486

#336B6B #8CB486

Calcule el color entre dos colores, #336B6B y #8CB486. 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)

#336B6B - #8CB486 | 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 #336B6B como 0% y #8CB486 como 100%.

0.0%	0.0% #336B6B	RGB 51 107 107	#336B6B
16.7%	16.7% #41776F	RGB 65 119 111	#41776F
33.3%	33.3% #508374	RGB 80 131 116	#508374
50.0%	50.0% #5F8F78	RGB 95 143 120	#5F8F78
66.7%	66.7% #6E9B7D	RGB 110 155 125	#6E9B7D
83.3%	83.3% #7DA781	RGB 125 167 129	#7DA781
100.0%	100.0% #8CB486	RGB 140 180 134	#8CB486

#336B6B #41776F #508374 #5F8F78 #6E9B7D #7DA781 #8CB486

#336B6B - #8CB486

Mezcla HSV

#336B6B - #8CB486 | 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 #336B6B como 0% y #8CB486 como 100%.

0.0%	0.0% #336B6B	RGB 51 107 107	#336B6B
16.7%	16.7% #3E776C	RGB 62 119 108	#3E776C
33.3%	33.3% #4A836D	RGB 74 131 109	#4A836D
50.0%	50.0% #578F6F	RGB 87 143 111	#578F6F
66.7%	66.7% #659B73	RGB 101 155 115	#659B73
83.3%	83.3% #75A778	RGB 117 167 120	#75A778
100.0%	100.0% #8CB486	RGB 140 180 134	#8CB486

#336B6B #3E776C #4A836D #578F6F #659B73 #75A778 #8CB486

#336B6B - #578F6F - #8CB486

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #336B6B 0%, #578F6F 50%, #8CB486 100%);
    background: -webkit-linear-gradient(top, #336B6B 0%, #578F6F 50%, #8CB486 100%);
    background: linear-gradient(to bottom, #336B6B 0%, #578F6F 50%, #8CB486 100%);
}
</style>