#5300A6 - #A1BBF7 | 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 #5300A6 a #A1BBF7

#5300A6 #A1BBF7

Calcule el color entre dos colores, #5300A6 y #A1BBF7. 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)

#5300A6 - #A1BBF7 | 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 #5300A6 como 0% y #A1BBF7 como 100%.

0.0%	0.0% #5300A6	RGB 83 0 166	#5300A6
16.7%	16.7% #601FB3	RGB 96 31 179	#601FB3
33.3%	33.3% #6D3EC1	RGB 109 62 193	#6D3EC1
50.0%	50.0% #7A5DCE	RGB 122 93 206	#7A5DCE
66.7%	66.7% #877CDC	RGB 135 124 220	#877CDC
83.3%	83.3% #949BE9	RGB 148 155 233	#949BE9
100.0%	100.0% #A1BBF7	RGB 161 187 247	#A1BBF7

#5300A6 #601FB3 #6D3EC1 #7A5DCE #877CDC #949BE9 #A1BBF7

#5300A6 - #A1BBF7

Mezcla HSV

#5300A6 - #A1BBF7 | 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 #5300A6 como 0% y #A1BBF7 como 100%.

0.0%	0.0% #5300A6	RGB 83 0 166	#5300A6
16.7%	16.7% #4E13B3	RGB 78 19 179	#4E13B3
33.3%	33.3% #4D29C1	RGB 77 41 193	#4D29C1
50.0%	50.0% #5143CE	RGB 81 67 206	#5143CE
66.7%	66.7% #5F63DC	RGB 95 99 220	#5F63DC
83.3%	83.3% #7E90E9	RGB 126 144 233	#7E90E9
100.0%	100.0% #A1BBF7	RGB 161 187 247	#A1BBF7

#5300A6 #4E13B3 #4D29C1 #5143CE #5F63DC #7E90E9 #A1BBF7

#5300A6 - #5143CE - #A1BBF7

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5300A6 0%, #5143CE 50%, #A1BBF7 100%);
    background: -webkit-linear-gradient(top, #5300A6 0%, #5143CE 50%, #A1BBF7 100%);
    background: linear-gradient(to bottom, #5300A6 0%, #5143CE 50%, #A1BBF7 100%);
}
</style>