#ABDEC2 - #4AAC8F | 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 #ABDEC2 a #4AAC8F

#ABDEC2 #4AAC8F

Calcule el color entre dos colores, #ABDEC2 y #4AAC8F. 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)

#ABDEC2 - #4AAC8F | 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 #ABDEC2 como 0% y #4AAC8F como 100%.

0.0%	0.0% #ABDEC2	RGB 171 222 194	#ABDEC2
16.7%	16.7% #9AD5B9	RGB 154 213 185	#9AD5B9
33.3%	33.3% #8ACDB1	RGB 138 205 177	#8ACDB1
50.0%	50.0% #7AC5A8	RGB 122 197 168	#7AC5A8
66.7%	66.7% #6ABCA0	RGB 106 188 160	#6ABCA0
83.3%	83.3% #5AB497	RGB 90 180 151	#5AB497
100.0%	100.0% #4AAC8F	RGB 74 172 143	#4AAC8F

#ABDEC2 #9AD5B9 #8ACDB1 #7AC5A8 #6ABCA0 #5AB497 #4AAC8F

#ABDEC2 - #4AAC8F

Mezcla HSV

#ABDEC2 - #4AAC8F | 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 #ABDEC2 como 0% y #4AAC8F como 100%.

0.0%	0.0% #ABDEC2	RGB 171 222 194	#ABDEC2
16.7%	16.7% #98D5B6	RGB 152 213 182	#98D5B6
33.3%	33.3% #86CDAC	RGB 134 205 172	#86CDAC
50.0%	50.0% #76C5A3	RGB 118 197 163	#76C5A3
66.7%	66.7% #66BC9B	RGB 102 188 155	#66BC9B
83.3%	83.3% #57B495	RGB 87 180 149	#57B495
100.0%	100.0% #4AAC8F	RGB 74 172 143	#4AAC8F

#ABDEC2 #98D5B6 #86CDAC #76C5A3 #66BC9B #57B495 #4AAC8F

#ABDEC2 - #76C5A3 - #4AAC8F

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #ABDEC2 0%, #76C5A3 50%, #4AAC8F 100%);
    background: -webkit-linear-gradient(top, #ABDEC2 0%, #76C5A3 50%, #4AAC8F 100%);
    background: linear-gradient(to bottom, #ABDEC2 0%, #76C5A3 50%, #4AAC8F 100%);
}
</style>