#DEE2FF - #7F9CD3 | 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 #DEE2FF to #7F9CD3

#DEE2FF #7F9CD3

Calculate the color between two colors, #DEE2FF and #7F9CD3. 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)

#DEE2FF - #7F9CD3 | 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 #DEE2FF as 0% and #7F9CD3 as 100%.

0.0%	0.0% #DEE2FF	RGB 222 226 255	#DEE2FF
16.7%	16.7% #CED6F7	RGB 206 214 247	#CED6F7
33.3%	33.3% #BECAF0	RGB 190 202 240	#BECAF0
50.0%	50.0% #AEBFE9	RGB 174 191 233	#AEBFE9
66.7%	66.7% #9EB3E1	RGB 158 179 225	#9EB3E1
83.3%	83.3% #8EA7DA	RGB 142 167 218	#8EA7DA
100.0%	100.0% #7F9CD3	RGB 127 156 211	#7F9CD3

#DEE2FF #CED6F7 #BECAF0 #AEBFE9 #9EB3E1 #8EA7DA #7F9CD3

#DEE2FF - #7F9CD3

HSV Blend

#DEE2FF - #7F9CD3 | 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 #DEE2FF as 0% and #7F9CD3 as 100%.

0.0%	0.0% #DEE2FF	RGB 222 226 255	#DEE2FF
16.7%	16.7% #CCD3F7	RGB 204 211 247	#CCD3F7
33.3%	33.3% #BBC6F0	RGB 187 198 240	#BBC6F0
50.0%	50.0% #ABB9E9	RGB 171 185 233	#ABB9E9
66.7%	66.7% #9CAEE1	RGB 156 174 225	#9CAEE1
83.3%	83.3% #8DA4DA	RGB 141 164 218	#8DA4DA
100.0%	100.0% #7F9CD3	RGB 127 156 211	#7F9CD3

#DEE2FF #CCD3F7 #BBC6F0 #ABB9E9 #9CAEE1 #8DA4DA #7F9CD3

#DEE2FF - #ABB9E9 - #7F9CD3

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #DEE2FF 0%, #ABB9E9 50%, #7F9CD3 100%);
    background: -webkit-linear-gradient(top, #DEE2FF 0%, #ABB9E9 50%, #7F9CD3 100%);
    background: linear-gradient(to bottom, #DEE2FF 0%, #ABB9E9 50%, #7F9CD3 100%);
}
</style>