#CAFFFF - #55E3E3 | 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 #CAFFFF a #55E3E3

#CAFFFF #55E3E3

Calcule el color entre dos colores, #CAFFFF y #55E3E3. 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)

#CAFFFF - #55E3E3 | 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 #CAFFFF como 0% y #55E3E3 como 100%.

0.0%	0.0% #CAFFFF	RGB 202 255 255	#CAFFFF
16.7%	16.7% #B6FAFA	RGB 182 250 250	#B6FAFA
33.3%	33.3% #A3F5F5	RGB 163 245 245	#A3F5F5
50.0%	50.0% #8FF1F1	RGB 143 241 241	#8FF1F1
66.7%	66.7% #7CECEC	RGB 124 236 236	#7CECEC
83.3%	83.3% #68E7E7	RGB 104 231 231	#68E7E7
100.0%	100.0% #55E3E3	RGB 85 227 227	#55E3E3

#CAFFFF #B6FAFA #A3F5F5 #8FF1F1 #7CECEC #68E7E7 #55E3E3

#CAFFFF - #55E3E3

Mezcla HSV

#CAFFFF - #55E3E3 | 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 #CAFFFF como 0% y #55E3E3 como 100%.

0.0%	0.0% #CAFFFF	RGB 202 255 255	#CAFFFF
16.7%	16.7% #B4FAFA	RGB 180 250 250	#B4FAFA
33.3%	33.3% #A0F5F5	RGB 160 245 245	#A0F5F5
50.0%	50.0% #8CF1F1	RGB 140 241 241	#8CF1F1
66.7%	66.7% #79ECEC	RGB 121 236 236	#79ECEC
83.3%	83.3% #66E7E7	RGB 102 231 231	#66E7E7
100.0%	100.0% #55E3E3	RGB 85 227 227	#55E3E3

#CAFFFF #B4FAFA #A0F5F5 #8CF1F1 #79ECEC #66E7E7 #55E3E3

#CAFFFF - #8CF1F1 - #55E3E3

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #CAFFFF 0%, #8CF1F1 50%, #55E3E3 100%);
    background: -webkit-linear-gradient(top, #CAFFFF 0%, #8CF1F1 50%, #55E3E3 100%);
    background: linear-gradient(to bottom, #CAFFFF 0%, #8CF1F1 50%, #55E3E3 100%);
}
</style>