#ABFFFF - #2EE5E9 | 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 #ABFFFF a #2EE5E9

#ABFFFF #2EE5E9

Calcule el color entre dos colores, #ABFFFF y #2EE5E9. 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)

#ABFFFF - #2EE5E9 | 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 #ABFFFF como 0% y #2EE5E9 como 100%.

0.0%	0.0% #ABFFFF	RGB 171 255 255	#ABFFFF
16.7%	16.7% #96FAFB	RGB 150 250 251	#96FAFB
33.3%	33.3% #81F6F7	RGB 129 246 247	#81F6F7
50.0%	50.0% #6CF2F4	RGB 108 242 244	#6CF2F4
66.7%	66.7% #57EDF0	RGB 87 237 240	#57EDF0
83.3%	83.3% #42E9EC	RGB 66 233 236	#42E9EC
100.0%	100.0% #2EE5E9	RGB 46 229 233	#2EE5E9

#ABFFFF #96FAFB #81F6F7 #6CF2F4 #57EDF0 #42E9EC #2EE5E9

#ABFFFF - #2EE5E9

Mezcla HSV

#ABFFFF - #2EE5E9 | 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 #ABFFFF como 0% y #2EE5E9 como 100%.

0.0%	0.0% #ABFFFF	RGB 171 255 255	#ABFFFF
16.7%	16.7% #94FAFB	RGB 148 250 251	#94FAFB
33.3%	33.3% #7FF6F7	RGB 127 246 247	#7FF6F7
50.0%	50.0% #69F2F4	RGB 105 242 244	#69F2F4
66.7%	66.7% #55EEF0	RGB 85 238 240	#55EEF0
83.3%	83.3% #41E9EC	RGB 65 233 236	#41E9EC
100.0%	100.0% #2EE5E9	RGB 46 229 233	#2EE5E9

#ABFFFF #94FAFB #7FF6F7 #69F2F4 #55EEF0 #41E9EC #2EE5E9

#ABFFFF - #69F2F4 - #2EE5E9

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #ABFFFF 0%, #69F2F4 50%, #2EE5E9 100%);
    background: -webkit-linear-gradient(top, #ABFFFF 0%, #69F2F4 50%, #2EE5E9 100%);
    background: linear-gradient(to bottom, #ABFFFF 0%, #69F2F4 50%, #2EE5E9 100%);
}
</style>