#3B5E4C - #8EA66E | 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 #3B5E4C a #8EA66E

#3B5E4C #8EA66E

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

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

0.0%	0.0% #3B5E4C	RGB 59 94 76	#3B5E4C
16.7%	16.7% #486A51	RGB 72 106 81	#486A51
33.3%	33.3% #567657	RGB 86 118 87	#567657
50.0%	50.0% #64825D	RGB 100 130 93	#64825D
66.7%	66.7% #728E62	RGB 114 142 98	#728E62
83.3%	83.3% #809A68	RGB 128 154 104	#809A68
100.0%	100.0% #8EA66E	RGB 142 166 110	#8EA66E

#3B5E4C #486A51 #567657 #64825D #728E62 #809A68 #8EA66E

#3B5E4C - #8EA66E

Mezcla HSV

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

0.0%	0.0% #3B5E4C	RGB 59 94 76	#3B5E4C
16.7%	16.7% #436A4F	RGB 67 106 79	#436A4F
33.3%	33.3% #4B7651	RGB 75 118 81	#4B7651
50.0%	50.0% #558253	RGB 85 130 83	#558253
66.7%	66.7% #678E5C	RGB 103 142 92	#678E5C
83.3%	83.3% #7A9A65	RGB 122 154 101	#7A9A65
100.0%	100.0% #8EA66E	RGB 142 166 110	#8EA66E

#3B5E4C #436A4F #4B7651 #558253 #678E5C #7A9A65 #8EA66E

#3B5E4C - #558253 - #8EA66E

Códigos CSS

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

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