#689D9C - #D3E3E2 | 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 #689D9C a #D3E3E2

#689D9C #D3E3E2

Calcule el color entre dos colores, #689D9C y #D3E3E2. 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)

#689D9C - #D3E3E2 | 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 #689D9C como 0% y #D3E3E2 como 100%.

0.0%	0.0% #689D9C	RGB 104 157 156	#689D9C
16.7%	16.7% #79A8A7	RGB 121 168 167	#79A8A7
33.3%	33.3% #8BB4B3	RGB 139 180 179	#8BB4B3
50.0%	50.0% #9DC0BF	RGB 157 192 191	#9DC0BF
66.7%	66.7% #AFCBCA	RGB 175 203 202	#AFCBCA
83.3%	83.3% #C1D7D6	RGB 193 215 214	#C1D7D6
100.0%	100.0% #D3E3E2	RGB 211 227 226	#D3E3E2

#689D9C #79A8A7 #8BB4B3 #9DC0BF #AFCBCA #C1D7D6 #D3E3E2

#689D9C - #D3E3E2

Mezcla HSV

#689D9C - #D3E3E2 | 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 #689D9C como 0% y #D3E3E2 como 100%.

0.0%	0.0% #689D9C	RGB 104 157 156	#689D9C
16.7%	16.7% #77A8A7	RGB 119 168 167	#77A8A7
33.3%	33.3% #87B4B2	RGB 135 180 178	#87B4B2
50.0%	50.0% #98C0BE	RGB 152 192 190	#98C0BE
66.7%	66.7% #ABCBCA	RGB 171 203 202	#ABCBCA
83.3%	83.3% #BED7D5	RGB 190 215 213	#BED7D5
100.0%	100.0% #D3E3E2	RGB 211 227 226	#D3E3E2

#689D9C #77A8A7 #87B4B2 #98C0BE #ABCBCA #BED7D5 #D3E3E2

#689D9C - #98C0BE - #D3E3E2

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #689D9C 0%, #98C0BE 50%, #D3E3E2 100%);
    background: -webkit-linear-gradient(top, #689D9C 0%, #98C0BE 50%, #D3E3E2 100%);
    background: linear-gradient(to bottom, #689D9C 0%, #98C0BE 50%, #D3E3E2 100%);
}
</style>