#978FE4 - #3D33A8 | colorate

colorate is a color scheme tool for designers and developers. This will help you draw inspiration and serve as a resource for your color work. Make this site better

Blend #978FE4 to #3D33A8

#978FE4 #3D33A8

Calculate the color between two colors, #978FE4 and #3D33A8. In calculation of RGB values, saturation between the dissimilar colors is low. In calculating of HSV values, saturation between the dissimilar colors is not low.

RGB Blend(Linear)

#978FE4 - #3D33A8 | colorate

Calculation of color between two colors based on RGB value. For colors that are distant from each other, the saturation between the two colors decreases. Expand the color between two colors with #978FE4 as 0% and #3D33A8 as 100%.

0.0%	0.0% #978FE4	RGB 151 143 228	#978FE4
16.7%	16.7% #887FDA	RGB 136 127 218	#887FDA
33.3%	33.3% #7970D0	RGB 121 112 208	#7970D0
50.0%	50.0% #6A61C6	RGB 106 97 198	#6A61C6
66.7%	66.7% #5B51BC	RGB 91 81 188	#5B51BC
83.3%	83.3% #4C42B2	RGB 76 66 178	#4C42B2
100.0%	100.0% #3D33A8	RGB 61 51 168	#3D33A8

#978FE4 #887FDA #7970D0 #6A61C6 #5B51BC #4C42B2 #3D33A8

#978FE4 - #3D33A8

HSV Blend

#978FE4 - #3D33A8 | colorate

Calculation of color between two colors based on HSV value. Even between distinct colors of color, the saturation between the two colors does not decrease. Expand the color between two colors with #978FE4 as 0% and #3D33A8 as 100%.

0.0%	0.0% #978FE4	RGB 151 143 228	#978FE4
16.7%	16.7% #857CDA	RGB 133 124 218	#857CDA
33.3%	33.3% #756CD0	RGB 117 108 208	#756CD0
50.0%	50.0% #655CC6	RGB 101 92 198	#655CC6
66.7%	66.7% #574DBC	RGB 87 77 188	#574DBC
83.3%	83.3% #493FB2	RGB 73 63 178	#493FB2
100.0%	100.0% #3D33A8	RGB 61 51 168	#3D33A8

#978FE4 #857CDA #756CD0 #655CC6 #574DBC #493FB2 #3D33A8

#978FE4 - #655CC6 - #3D33A8

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #978FE4 0%, #655CC6 50%, #3D33A8 100%);
    background: -webkit-linear-gradient(top, #978FE4 0%, #655CC6 50%, #3D33A8 100%);
    background: linear-gradient(to bottom, #978FE4 0%, #655CC6 50%, #3D33A8 100%);
}
</style>