#DCE2FF - #7E9BD3 | 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 #DCE2FF to #7E9BD3

#DCE2FF #7E9BD3

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

#DCE2FF - #7E9BD3 | 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 #DCE2FF as 0% and #7E9BD3 as 100%.

0.0%	0.0% #DCE2FF	RGB 220 226 255	#DCE2FF
16.7%	16.7% #CCD6F7	RGB 204 214 247	#CCD6F7
33.3%	33.3% #BCCAF0	RGB 188 202 240	#BCCAF0
50.0%	50.0% #ADBEE9	RGB 173 190 233	#ADBEE9
66.7%	66.7% #9DB2E1	RGB 157 178 225	#9DB2E1
83.3%	83.3% #8DA6DA	RGB 141 166 218	#8DA6DA
100.0%	100.0% #7E9BD3	RGB 126 155 211	#7E9BD3

#DCE2FF #CCD6F7 #BCCAF0 #ADBEE9 #9DB2E1 #8DA6DA #7E9BD3

#DCE2FF - #7E9BD3

HSV Blend

#DCE2FF - #7E9BD3 | 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 #DCE2FF as 0% and #7E9BD3 as 100%.

0.0%	0.0% #DCE2FF	RGB 220 226 255	#DCE2FF
16.7%	16.7% #CAD3F7	RGB 202 211 247	#CAD3F7
33.3%	33.3% #BAC6F0	RGB 186 198 240	#BAC6F0
50.0%	50.0% #AABAE9	RGB 170 186 233	#AABAE9
66.7%	66.7% #9AAEE1	RGB 154 174 225	#9AAEE1
83.3%	83.3% #8CA4DA	RGB 140 164 218	#8CA4DA
100.0%	100.0% #7E9BD3	RGB 126 155 211	#7E9BD3

#DCE2FF #CAD3F7 #BAC6F0 #AABAE9 #9AAEE1 #8CA4DA #7E9BD3

#DCE2FF - #AABAE9 - #7E9BD3

CSS codes

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

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