#C7DCFF - #7186D9 | 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 #C7DCFF to #7186D9

#C7DCFF #7186D9

Calculate the color between two colors, #C7DCFF and #7186D9. 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)

#C7DCFF - #7186D9 | 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 #C7DCFF as 0% and #7186D9 as 100%.

0.0%	0.0% #C7DCFF	RGB 199 220 255	#C7DCFF
16.7%	16.7% #B8CDF8	RGB 184 205 248	#B8CDF8
33.3%	33.3% #AABFF2	RGB 170 191 242	#AABFF2
50.0%	50.0% #9CB1EC	RGB 156 177 236	#9CB1EC
66.7%	66.7% #8DA2E5	RGB 141 162 229	#8DA2E5
83.3%	83.3% #7F94DF	RGB 127 148 223	#7F94DF
100.0%	100.0% #7186D9	RGB 113 134 217	#7186D9

#C7DCFF #B8CDF8 #AABFF2 #9CB1EC #8DA2E5 #7F94DF #7186D9

#C7DCFF - #7186D9

HSV Blend

#C7DCFF - #7186D9 | 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 #C7DCFF as 0% and #7186D9 as 100%.

0.0%	0.0% #C7DCFF	RGB 199 220 255	#C7DCFF
16.7%	16.7% #B7CDF8	RGB 183 205 248	#B7CDF8
33.3%	33.3% #A8BFF2	RGB 168 191 242	#A8BFF2
50.0%	50.0% #99B1EC	RGB 153 177 236	#99B1EC
66.7%	66.7% #8BA2E5	RGB 139 162 229	#8BA2E5
83.3%	83.3% #7D94DF	RGB 125 148 223	#7D94DF
100.0%	100.0% #7186D9	RGB 113 134 217	#7186D9

#C7DCFF #B7CDF8 #A8BFF2 #99B1EC #8BA2E5 #7D94DF #7186D9

#C7DCFF - #99B1EC - #7186D9

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #C7DCFF 0%, #99B1EC 50%, #7186D9 100%);
    background: -webkit-linear-gradient(top, #C7DCFF 0%, #99B1EC 50%, #7186D9 100%);
    background: linear-gradient(to bottom, #C7DCFF 0%, #99B1EC 50%, #7186D9 100%);
}
</style>