#9CDFDF - #2BB4B6 | 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 #9CDFDF a #2BB4B6

#9CDFDF #2BB4B6

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

#9CDFDF - #2BB4B6 | 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 #9CDFDF como 0% y #2BB4B6 como 100%.

0.0%	0.0% #9CDFDF	RGB 156 223 223	#9CDFDF
16.7%	16.7% #89D7D8	RGB 137 215 216	#89D7D8
33.3%	33.3% #76D0D1	RGB 118 208 209	#76D0D1
50.0%	50.0% #63C9CA	RGB 99 201 202	#63C9CA
66.7%	66.7% #50C2C3	RGB 80 194 195	#50C2C3
83.3%	83.3% #3DBBBC	RGB 61 187 188	#3DBBBC
100.0%	100.0% #2BB4B6	RGB 43 180 182	#2BB4B6

#9CDFDF #89D7D8 #76D0D1 #63C9CA #50C2C3 #3DBBBC #2BB4B6

#9CDFDF - #2BB4B6

Mezcla HSV

#9CDFDF - #2BB4B6 | 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 #9CDFDF como 0% y #2BB4B6 como 100%.

0.0%	0.0% #9CDFDF	RGB 156 223 223	#9CDFDF
16.7%	16.7% #86D7D8	RGB 134 215 216	#86D7D8
33.3%	33.3% #72D0D1	RGB 114 208 209	#72D0D1
50.0%	50.0% #5EC9CA	RGB 94 201 202	#5EC9CA
66.7%	66.7% #4CC2C3	RGB 76 194 195	#4CC2C3
83.3%	83.3% #3BBBBC	RGB 59 187 188	#3BBBBC
100.0%	100.0% #2BB4B6	RGB 43 180 182	#2BB4B6

#9CDFDF #86D7D8 #72D0D1 #5EC9CA #4CC2C3 #3BBBBC #2BB4B6

#9CDFDF - #5EC9CA - #2BB4B6

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #9CDFDF 0%, #5EC9CA 50%, #2BB4B6 100%);
    background: -webkit-linear-gradient(top, #9CDFDF 0%, #5EC9CA 50%, #2BB4B6 100%);
    background: linear-gradient(to bottom, #9CDFDF 0%, #5EC9CA 50%, #2BB4B6 100%);
}
</style>