#0063A1 - #AFEEDE | 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 #0063A1 a #AFEEDE

#0063A1 #AFEEDE

Calcule el color entre dos colores, #0063A1 y #AFEEDE. 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)

#0063A1 - #AFEEDE | 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 #0063A1 como 0% y #AFEEDE como 100%.

0.0%	0.0% #0063A1	RGB 0 99 161	#0063A1
16.7%	16.7% #1D7AAB	RGB 29 122 171	#1D7AAB
33.3%	33.3% #3A91B5	RGB 58 145 181	#3A91B5
50.0%	50.0% #57A8BF	RGB 87 168 191	#57A8BF
66.7%	66.7% #74BFC9	RGB 116 191 201	#74BFC9
83.3%	83.3% #91D6D3	RGB 145 214 211	#91D6D3
100.0%	100.0% #AFEEDE	RGB 175 238 222	#AFEEDE

#0063A1 #1D7AAB #3A91B5 #57A8BF #74BFC9 #91D6D3 #AFEEDE

#0063A1 - #AFEEDE

Mezcla HSV

#0063A1 - #AFEEDE | 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 #0063A1 como 0% y #AFEEDE como 100%.

0.0%	0.0% #0063A1	RGB 0 99 161	#0063A1
16.7%	16.7% #1583AD	RGB 21 131 173	#1583AD
33.3%	33.3% #2DA2BA	RGB 45 162 186	#2DA2BA
50.0%	50.0% #49BFC7	RGB 73 191 199	#49BFC7
66.7%	66.7% #68D4CF	RGB 104 212 207	#68D4CF
83.3%	83.3% #89E1D4	RGB 137 225 212	#89E1D4
100.0%	100.0% #AFEEDE	RGB 175 238 222	#AFEEDE

#0063A1 #1583AD #2DA2BA #49BFC7 #68D4CF #89E1D4 #AFEEDE

#0063A1 - #49BFC7 - #AFEEDE

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #0063A1 0%, #49BFC7 50%, #AFEEDE 100%);
    background: -webkit-linear-gradient(top, #0063A1 0%, #49BFC7 50%, #AFEEDE 100%);
    background: linear-gradient(to bottom, #0063A1 0%, #49BFC7 50%, #AFEEDE 100%);
}
</style>