#6B7DCF - #8DA5FF | 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 #6B7DCF to #8DA5FF

#6B7DCF #8DA5FF

Calculate the color between two colors, #6B7DCF and #8DA5FF. 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)

#6B7DCF - #8DA5FF | 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 #6B7DCF as 0% and #8DA5FF as 100%.

0.0%	0.0% #6B7DCF	RGB 107 125 207	#6B7DCF
16.7%	16.7% #7083D7	RGB 112 131 215	#7083D7
33.3%	33.3% #768ADF	RGB 118 138 223	#768ADF
50.0%	50.0% #7C91E7	RGB 124 145 231	#7C91E7
66.7%	66.7% #8197EF	RGB 129 151 239	#8197EF
83.3%	83.3% #879EF7	RGB 135 158 247	#879EF7
100.0%	100.0% #8DA5FF	RGB 141 165 255	#8DA5FF

#6B7DCF #7083D7 #768ADF #7C91E7 #8197EF #879EF7 #8DA5FF

#6B7DCF - #8DA5FF

HSV Blend

#6B7DCF - #8DA5FF | 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 #6B7DCF as 0% and #8DA5FF as 100%.

0.0%	0.0% #6B7DCF	RGB 107 125 207	#6B7DCF
16.7%	16.7% #7083D7	RGB 112 131 215	#7083D7
33.3%	33.3% #7589DF	RGB 117 137 223	#7589DF
50.0%	50.0% #7B90E7	RGB 123 144 231	#7B90E7
66.7%	66.7% #8197EF	RGB 129 151 239	#8197EF
83.3%	83.3% #879EF7	RGB 135 158 247	#879EF7
100.0%	100.0% #8DA5FF	RGB 141 165 255	#8DA5FF

#6B7DCF #7083D7 #7589DF #7B90E7 #8197EF #879EF7 #8DA5FF

#6B7DCF - #7B90E7 - #8DA5FF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #6B7DCF 0%, #7B90E7 50%, #8DA5FF 100%);
    background: -webkit-linear-gradient(top, #6B7DCF 0%, #7B90E7 50%, #8DA5FF 100%);
    background: linear-gradient(to bottom, #6B7DCF 0%, #7B90E7 50%, #8DA5FF 100%);
}
</style>