#6B24B2 - #AFD6ED | 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 #6B24B2 a #AFD6ED

#6B24B2 #AFD6ED

Calcule el color entre dos colores, #6B24B2 y #AFD6ED. 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)

#6B24B2 - #AFD6ED | 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 #6B24B2 como 0% y #AFD6ED como 100%.

0.0%	0.0% #6B24B2	RGB 107 36 178	#6B24B2
16.7%	16.7% #7641BB	RGB 118 65 187	#7641BB
33.3%	33.3% #815FC5	RGB 129 95 197	#815FC5
50.0%	50.0% #8D7DCF	RGB 141 125 207	#8D7DCF
66.7%	66.7% #989AD9	RGB 152 154 217	#989AD9
83.3%	83.3% #A3B8E3	RGB 163 184 227	#A3B8E3
100.0%	100.0% #AFD6ED	RGB 175 214 237	#AFD6ED

#6B24B2 #7641BB #815FC5 #8D7DCF #989AD9 #A3B8E3 #AFD6ED

#6B24B2 - #AFD6ED

Mezcla HSV

#6B24B2 - #AFD6ED | 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 #6B24B2 como 0% y #AFD6ED como 100%.

0.0%	0.0% #6B24B2	RGB 107 36 178	#6B24B2
16.7%	16.7% #6036BB	RGB 96 54 187	#6036BB
33.3%	33.3% #5A4BC5	RGB 90 75 197	#5A4BC5
50.0%	50.0% #6168CF	RGB 97 104 207	#6168CF
66.7%	66.7% #7991D9	RGB 121 145 217	#7991D9
83.3%	83.3% #93B6E3	RGB 147 182 227	#93B6E3
100.0%	100.0% #AFD6ED	RGB 175 214 237	#AFD6ED

#6B24B2 #6036BB #5A4BC5 #6168CF #7991D9 #93B6E3 #AFD6ED

#6B24B2 - #6168CF - #AFD6ED

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #6B24B2 0%, #6168CF 50%, #AFD6ED 100%);
    background: -webkit-linear-gradient(top, #6B24B2 0%, #6168CF 50%, #AFD6ED 100%);
    background: linear-gradient(to bottom, #6B24B2 0%, #6168CF 50%, #AFD6ED 100%);
}
</style>