#8AD2D2 - #1EA4A3 | 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 #8AD2D2 a #1EA4A3

#8AD2D2 #1EA4A3

Calcule el color entre dos colores, #8AD2D2 y #1EA4A3. 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)

#8AD2D2 - #1EA4A3 | 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 #8AD2D2 como 0% y #1EA4A3 como 100%.

0.0%	0.0% #8AD2D2	RGB 138 210 210	#8AD2D2
16.7%	16.7% #78CACA	RGB 120 202 202	#78CACA
33.3%	33.3% #66C2C2	RGB 102 194 194	#66C2C2
50.0%	50.0% #54BBBA	RGB 84 187 186	#54BBBA
66.7%	66.7% #42B3B2	RGB 66 179 178	#42B3B2
83.3%	83.3% #30ABAA	RGB 48 171 170	#30ABAA
100.0%	100.0% #1EA4A3	RGB 30 164 163	#1EA4A3

#8AD2D2 #78CACA #66C2C2 #54BBBA #42B3B2 #30ABAA #1EA4A3

#8AD2D2 - #1EA4A3

Mezcla HSV

#8AD2D2 - #1EA4A3 | 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 #8AD2D2 como 0% y #1EA4A3 como 100%.

0.0%	0.0% #8AD2D2	RGB 138 210 210	#8AD2D2
16.7%	16.7% #74CACA	RGB 116 202 202	#74CACA
33.3%	33.3% #61C2C2	RGB 97 194 194	#61C2C2
50.0%	50.0% #4EBBBA	RGB 78 187 186	#4EBBBA
66.7%	66.7% #3DB3B2	RGB 61 179 178	#3DB3B2
83.3%	83.3% #2CABAA	RGB 44 171 170	#2CABAA
100.0%	100.0% #1EA4A3	RGB 30 164 163	#1EA4A3

#8AD2D2 #74CACA #61C2C2 #4EBBBA #3DB3B2 #2CABAA #1EA4A3

#8AD2D2 - #4EBBBA - #1EA4A3

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #8AD2D2 0%, #4EBBBA 50%, #1EA4A3 100%);
    background: -webkit-linear-gradient(top, #8AD2D2 0%, #4EBBBA 50%, #1EA4A3 100%);
    background: linear-gradient(to bottom, #8AD2D2 0%, #4EBBBA 50%, #1EA4A3 100%);
}
</style>