#54BEA2 - #CEECE4 | 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 #54BEA2 a #CEECE4

#54BEA2 #CEECE4

Calcule el color entre dos colores, #54BEA2 y #CEECE4. 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)

#54BEA2 - #CEECE4 | 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 #54BEA2 como 0% y #CEECE4 como 100%.

0.0%	0.0% #54BEA2	RGB 84 190 162	#54BEA2
16.7%	16.7% #68C5AD	RGB 104 197 173	#68C5AD
33.3%	33.3% #7CCDB8	RGB 124 205 184	#7CCDB8
50.0%	50.0% #91D5C3	RGB 145 213 195	#91D5C3
66.7%	66.7% #A5DCCE	RGB 165 220 206	#A5DCCE
83.3%	83.3% #B9E4D9	RGB 185 228 217	#B9E4D9
100.0%	100.0% #CEECE4	RGB 206 236 228	#CEECE4

#54BEA2 #68C5AD #7CCDB8 #91D5C3 #A5DCCE #B9E4D9 #CEECE4

#54BEA2 - #CEECE4

Mezcla HSV

#54BEA2 - #CEECE4 | 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 #54BEA2 como 0% y #CEECE4 como 100%.

0.0%	0.0% #54BEA2	RGB 84 190 162	#54BEA2
16.7%	16.7% #65C5AC	RGB 101 197 172	#65C5AC
33.3%	33.3% #78CDB6	RGB 120 205 182	#78CDB6
50.0%	50.0% #8CD5C1	RGB 140 213 193	#8CD5C1
66.7%	66.7% #A0DCCC	RGB 160 220 204	#A0DCCC
83.3%	83.3% #B6E4D8	RGB 182 228 216	#B6E4D8
100.0%	100.0% #CEECE4	RGB 206 236 228	#CEECE4

#54BEA2 #65C5AC #78CDB6 #8CD5C1 #A0DCCC #B6E4D8 #CEECE4

#54BEA2 - #8CD5C1 - #CEECE4

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #54BEA2 0%, #8CD5C1 50%, #CEECE4 100%);
    background: -webkit-linear-gradient(top, #54BEA2 0%, #8CD5C1 50%, #CEECE4 100%);
    background: linear-gradient(to bottom, #54BEA2 0%, #8CD5C1 50%, #CEECE4 100%);
}
</style>