#D4DDF2 - #8399E5 | 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 #D4DDF2 to #8399E5

#D4DDF2 #8399E5

Calculate the color between two colors, #D4DDF2 and #8399E5. 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)

#D4DDF2 - #8399E5 | 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 #D4DDF2 as 0% and #8399E5 as 100%.

0.0%	0.0% #D4DDF2	RGB 212 221 242	#D4DDF2
16.7%	16.7% #C6D1EF	RGB 198 209 239	#C6D1EF
33.3%	33.3% #B9C6ED	RGB 185 198 237	#B9C6ED
50.0%	50.0% #ABBBEB	RGB 171 187 235	#ABBBEB
66.7%	66.7% #9EAFE9	RGB 158 175 233	#9EAFE9
83.3%	83.3% #90A4E7	RGB 144 164 231	#90A4E7
100.0%	100.0% #8399E5	RGB 131 153 229	#8399E5

#D4DDF2 #C6D1EF #B9C6ED #ABBBEB #9EAFE9 #90A4E7 #8399E5

#D4DDF2 - #8399E5

HSV Blend

#D4DDF2 - #8399E5 | 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 #D4DDF2 as 0% and #8399E5 as 100%.

0.0%	0.0% #D4DDF2	RGB 212 221 242	#D4DDF2
16.7%	16.7% #C5D1EF	RGB 197 209 239	#C5D1EF
33.3%	33.3% #B8C6ED	RGB 184 198 237	#B8C6ED
50.0%	50.0% #AABBEB	RGB 170 187 235	#AABBEB
66.7%	66.7% #9DB0E9	RGB 157 176 233	#9DB0E9
83.3%	83.3% #8FA4E7	RGB 143 164 231	#8FA4E7
100.0%	100.0% #8399E5	RGB 131 153 229	#8399E5

#D4DDF2 #C5D1EF #B8C6ED #AABBEB #9DB0E9 #8FA4E7 #8399E5

#D4DDF2 - #AABBEB - #8399E5

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #D4DDF2 0%, #AABBEB 50%, #8399E5 100%);
    background: -webkit-linear-gradient(top, #D4DDF2 0%, #AABBEB 50%, #8399E5 100%);
    background: linear-gradient(to bottom, #D4DDF2 0%, #AABBEB 50%, #8399E5 100%);
}
</style>