#3C5E4C - #8FA66E | 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 #3C5E4C a #8FA66E

#3C5E4C #8FA66E

Calcule el color entre dos colores, #3C5E4C y #8FA66E. 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)

#3C5E4C - #8FA66E | 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 #3C5E4C como 0% y #8FA66E como 100%.

0.0%	0.0% #3C5E4C	RGB 60 94 76	#3C5E4C
16.7%	16.7% #496A51	RGB 73 106 81	#496A51
33.3%	33.3% #577657	RGB 87 118 87	#577657
50.0%	50.0% #65825D	RGB 101 130 93	#65825D
66.7%	66.7% #738E62	RGB 115 142 98	#738E62
83.3%	83.3% #819A68	RGB 129 154 104	#819A68
100.0%	100.0% #8FA66E	RGB 143 166 110	#8FA66E

#3C5E4C #496A51 #577657 #65825D #738E62 #819A68 #8FA66E

#3C5E4C - #8FA66E

Mezcla HSV

#3C5E4C - #8FA66E | 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 #3C5E4C como 0% y #8FA66E como 100%.

0.0%	0.0% #3C5E4C	RGB 60 94 76	#3C5E4C
16.7%	16.7% #446A4F	RGB 68 106 79	#446A4F
33.3%	33.3% #4C7651	RGB 76 118 81	#4C7651
50.0%	50.0% #578254	RGB 87 130 84	#578254
66.7%	66.7% #688E5C	RGB 104 142 92	#688E5C
83.3%	83.3% #7B9A65	RGB 123 154 101	#7B9A65
100.0%	100.0% #8FA66E	RGB 143 166 110	#8FA66E

#3C5E4C #446A4F #4C7651 #578254 #688E5C #7B9A65 #8FA66E

#3C5E4C - #578254 - #8FA66E

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C5E4C 0%, #578254 50%, #8FA66E 100%);
    background: -webkit-linear-gradient(top, #3C5E4C 0%, #578254 50%, #8FA66E 100%);
    background: linear-gradient(to bottom, #3C5E4C 0%, #578254 50%, #8FA66E 100%);
}
</style>