#2F9ABC - #BBDDD1 | 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 #2F9ABC a #BBDDD1

#2F9ABC #BBDDD1

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

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

0.0%	0.0% #2F9ABC	RGB 47 154 188	#2F9ABC
16.7%	16.7% #46A5BF	RGB 70 165 191	#46A5BF
33.3%	33.3% #5DB0C3	RGB 93 176 195	#5DB0C3
50.0%	50.0% #75BBC6	RGB 117 187 198	#75BBC6
66.7%	66.7% #8CC6CA	RGB 140 198 202	#8CC6CA
83.3%	83.3% #A3D1CD	RGB 163 209 205	#A3D1CD
100.0%	100.0% #BBDDD1	RGB 187 221 209	#BBDDD1

#2F9ABC #46A5BF #5DB0C3 #75BBC6 #8CC6CA #A3D1CD #BBDDD1

#2F9ABC - #BBDDD1

Mezcla HSV

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

0.0%	0.0% #2F99BC	RGB 47 153 188	#2F99BC
16.7%	16.7% #43AFC1	RGB 67 175 193	#43AFC1
33.3%	33.3% #59C2C7	RGB 89 194 199	#59C2C7
50.0%	50.0% #70CCC7	RGB 112 204 199	#70CCC7
66.7%	66.7% #87D2C6	RGB 135 210 198	#87D2C6
83.3%	83.3% #A0D7C9	RGB 160 215 201	#A0D7C9
100.0%	100.0% #BBDDD1	RGB 187 221 209	#BBDDD1

#2F99BC #43AFC1 #59C2C7 #70CCC7 #87D2C6 #A0D7C9 #BBDDD1

#2F9ABC - #70CCC7 - #BBDDD1

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #2F99BC 0%, #70CCC7 50%, #BBDDD1 100%);
    background: -webkit-linear-gradient(top, #2F99BC 0%, #70CCC7 50%, #BBDDD1 100%);
    background: linear-gradient(to bottom, #2F99BC 0%, #70CCC7 50%, #BBDDD1 100%);
}
</style>