#3BBABA - #C7EBEB | 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 #3BBABA a #C7EBEB

#3BBABA #C7EBEB

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

#3BBABA - #C7EBEB | 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 #3BBABA como 0% y #C7EBEB como 100%.

0.0%	0.0% #3BBABA	RGB 59 186 186	#3BBABA
16.7%	16.7% #52C2C2	RGB 82 194 194	#52C2C2
33.3%	33.3% #69CACA	RGB 105 202 202	#69CACA
50.0%	50.0% #81D2D2	RGB 129 210 210	#81D2D2
66.7%	66.7% #98DADA	RGB 152 218 218	#98DADA
83.3%	83.3% #AFE2E2	RGB 175 226 226	#AFE2E2
100.0%	100.0% #C7EBEB	RGB 199 235 235	#C7EBEB

#3BBABA #52C2C2 #69CACA #81D2D2 #98DADA #AFE2E2 #C7EBEB

#3BBABA - #C7EBEB

Mezcla HSV

#3BBABA - #C7EBEB | 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 #3BBABA como 0% y #C7EBEB como 100%.

0.0%	0.0% #3BBABA	RGB 59 186 186	#3BBABA
16.7%	16.7% #4EC2C2	RGB 78 194 194	#4EC2C2
33.3%	33.3% #63CACA	RGB 99 202 202	#63CACA
50.0%	50.0% #7AD2D2	RGB 122 210 210	#7AD2D2
66.7%	66.7% #92DADA	RGB 146 218 218	#92DADA
83.3%	83.3% #ACE2E2	RGB 172 226 226	#ACE2E2
100.0%	100.0% #C7EBEB	RGB 199 235 235	#C7EBEB

#3BBABA #4EC2C2 #63CACA #7AD2D2 #92DADA #ACE2E2 #C7EBEB

#3BBABA - #7AD2D2 - #C7EBEB

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3BBABA 0%, #7AD2D2 50%, #C7EBEB 100%);
    background: -webkit-linear-gradient(top, #3BBABA 0%, #7AD2D2 50%, #C7EBEB 100%);
    background: linear-gradient(to bottom, #3BBABA 0%, #7AD2D2 50%, #C7EBEB 100%);
}
</style>