#3A0096 - #D54FF2 | 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 #3A0096 a #D54FF2

#3A0096 #D54FF2

Calcule el color entre dos colores, #3A0096 y #D54FF2. 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)

#3A0096 - #D54FF2 | 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 #3A0096 como 0% y #D54FF2 como 100%.

0.0%	0.0% #3A0096	RGB 58 0 150	#3A0096
16.7%	16.7% #530DA5	RGB 83 13 165	#530DA5
33.3%	33.3% #6D1AB4	RGB 109 26 180	#6D1AB4
50.0%	50.0% #8727C4	RGB 135 39 196	#8727C4
66.7%	66.7% #A134D3	RGB 161 52 211	#A134D3
83.3%	83.3% #BB41E2	RGB 187 65 226	#BB41E2
100.0%	100.0% #D54FF2	RGB 213 79 242	#D54FF2

#3A0096 #530DA5 #6D1AB4 #8727C4 #A134D3 #BB41E2 #D54FF2

#3A0096 - #D54FF2

Mezcla HSV

#3A0096 - #D54FF2 | 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 #3A0096 como 0% y #D54FF2 como 100%.

0.0%	0.0% #3A0096	RGB 58 0 150	#3A0096
16.7%	16.7% #5008A5	RGB 80 8 165	#5008A5
33.3%	33.3% #6913B4	RGB 105 19 180	#6913B4
50.0%	50.0% #831FC4	RGB 131 31 196	#831FC4
66.7%	66.7% #9D2DD3	RGB 157 45 211	#9D2DD3
83.3%	83.3% #B93DE2	RGB 185 61 226	#B93DE2
100.0%	100.0% #D54FF2	RGB 213 79 242	#D54FF2

#3A0096 #5008A5 #6913B4 #831FC4 #9D2DD3 #B93DE2 #D54FF2

#3A0096 - #831FC4 - #D54FF2

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3A0096 0%, #831FC4 50%, #D54FF2 100%);
    background: -webkit-linear-gradient(top, #3A0096 0%, #831FC4 50%, #D54FF2 100%);
    background: linear-gradient(to bottom, #3A0096 0%, #831FC4 50%, #D54FF2 100%);
}
</style>