#5E70FF - #84BCFF | 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 #5E70FF to #84BCFF

#5E70FF #84BCFF

Calculate the color between two colors, #5E70FF and #84BCFF. 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)

#5E70FF - #84BCFF | 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 #5E70FF as 0% and #84BCFF as 100%.

0.0%	0.0% #5E70FF	RGB 94 112 255	#5E70FF
16.7%	16.7% #647CFF	RGB 100 124 255	#647CFF
33.3%	33.3% #6A89FF	RGB 106 137 255	#6A89FF
50.0%	50.0% #7196FF	RGB 113 150 255	#7196FF
66.7%	66.7% #77A2FF	RGB 119 162 255	#77A2FF
83.3%	83.3% #7DAFFF	RGB 125 175 255	#7DAFFF
100.0%	100.0% #84BCFF	RGB 132 188 255	#84BCFF

#5E70FF #647CFF #6A89FF #7196FF #77A2FF #7DAFFF #84BCFF

#5E70FF - #84BCFF

HSV Blend

#5E70FF - #84BCFF | 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 #5E70FF as 0% and #84BCFF as 100%.

0.0%	0.0% #5D6FFF	RGB 93 111 255	#5D6FFF
16.7%	16.7% #647EFF	RGB 100 126 255	#647EFF
33.3%	33.3% #6A8CFF	RGB 106 140 255	#6A8CFF
50.0%	50.0% #7199FF	RGB 113 153 255	#7199FF
66.7%	66.7% #77A5FF	RGB 119 165 255	#77A5FF
83.3%	83.3% #7DB1FF	RGB 125 177 255	#7DB1FF
100.0%	100.0% #84BCFF	RGB 132 188 255	#84BCFF

#5D6FFF #647EFF #6A8CFF #7199FF #77A5FF #7DB1FF #84BCFF

#5E70FF - #7199FF - #84BCFF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5D6FFF 0%, #7199FF 50%, #84BCFF 100%);
    background: -webkit-linear-gradient(top, #5D6FFF 0%, #7199FF 50%, #84BCFF 100%);
    background: linear-gradient(to bottom, #5D6FFF 0%, #7199FF 50%, #84BCFF 100%);
}
</style>