#C7D3E9 - #6B87B4 | 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 #C7D3E9 to #6B87B4

#C7D3E9 #6B87B4

Calculate the color between two colors, #C7D3E9 and #6B87B4. 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)

#C7D3E9 - #6B87B4 | 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 #C7D3E9 as 0% and #6B87B4 as 100%.

0.0%	0.0% #C7D3E9	RGB 199 211 233	#C7D3E9
16.7%	16.7% #B7C6E0	RGB 183 198 224	#B7C6E0
33.3%	33.3% #A8B9D7	RGB 168 185 215	#A8B9D7
50.0%	50.0% #99ADCE	RGB 153 173 206	#99ADCE
66.7%	66.7% #89A0C5	RGB 137 160 197	#89A0C5
83.3%	83.3% #7A93BC	RGB 122 147 188	#7A93BC
100.0%	100.0% #6B87B4	RGB 107 135 180	#6B87B4

#C7D3E9 #B7C6E0 #A8B9D7 #99ADCE #89A0C5 #7A93BC #6B87B4

#C7D3E9 - #6B87B4

HSV Blend

#C7D3E9 - #6B87B4 | 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 #C7D3E9 as 0% and #6B87B4 as 100%.

0.0%	0.0% #C7D3E9	RGB 199 211 233	#C7D3E9
16.7%	16.7% #B5C4E0	RGB 181 196 224	#B5C4E0
33.3%	33.3% #A5B7D7	RGB 165 183 215	#A5B7D7
50.0%	50.0% #95AACE	RGB 149 170 206	#95AACE
66.7%	66.7% #869EC5	RGB 134 158 197	#869EC5
83.3%	83.3% #7892BC	RGB 120 146 188	#7892BC
100.0%	100.0% #6B87B4	RGB 107 135 180	#6B87B4

#C7D3E9 #B5C4E0 #A5B7D7 #95AACE #869EC5 #7892BC #6B87B4

#C7D3E9 - #95AACE - #6B87B4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #C7D3E9 0%, #95AACE 50%, #6B87B4 100%);
    background: -webkit-linear-gradient(top, #C7D3E9 0%, #95AACE 50%, #6B87B4 100%);
    background: linear-gradient(to bottom, #C7D3E9 0%, #95AACE 50%, #6B87B4 100%);
}
</style>