#7A8CC2 - #D9DEED | 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 #7A8CC2 to #D9DEED

#7A8CC2 #D9DEED

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

#7A8CC2 - #D9DEED | 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 #7A8CC2 as 0% and #D9DEED as 100%.

0.0%	0.0% #7A8CC2	RGB 122 140 194	#7A8CC2
16.7%	16.7% #8999C9	RGB 137 153 201	#8999C9
33.3%	33.3% #99A7D0	RGB 153 167 208	#99A7D0
50.0%	50.0% #A9B5D7	RGB 169 181 215	#A9B5D7
66.7%	66.7% #B9C2DE	RGB 185 194 222	#B9C2DE
83.3%	83.3% #C9D0E5	RGB 201 208 229	#C9D0E5
100.0%	100.0% #D9DEED	RGB 217 222 237	#D9DEED

#7A8CC2 #8999C9 #99A7D0 #A9B5D7 #B9C2DE #C9D0E5 #D9DEED

#7A8CC2 - #D9DEED

HSV Blend

#7A8CC2 - #D9DEED | 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 #7A8CC2 as 0% and #D9DEED as 100%.

0.0%	0.0% #7A8CC2	RGB 122 140 194	#7A8CC2
16.7%	16.7% #8898C9	RGB 136 152 201	#8898C9
33.3%	33.3% #96A5D0	RGB 150 165 208	#96A5D0
50.0%	50.0% #A6B2D7	RGB 166 178 215	#A6B2D7
66.7%	66.7% #B6C0DE	RGB 182 192 222	#B6C0DE
83.3%	83.3% #C7CFE5	RGB 199 207 229	#C7CFE5
100.0%	100.0% #D9DEED	RGB 217 222 237	#D9DEED

#7A8CC2 #8898C9 #96A5D0 #A6B2D7 #B6C0DE #C7CFE5 #D9DEED

#7A8CC2 - #A6B2D7 - #D9DEED

CSS codes

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

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