#6C9ECE - #D5E3F1 | 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 #6C9ECE to #D5E3F1

#6C9ECE #D5E3F1

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

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

0.0%	0.0% #6C9ECE	RGB 108 158 206	#6C9ECE
16.7%	16.7% #7DA9D3	RGB 125 169 211	#7DA9D3
33.3%	33.3% #8FB5D9	RGB 143 181 217	#8FB5D9
50.0%	50.0% #A0C0DF	RGB 160 192 223	#A0C0DF
66.7%	66.7% #B2CCE5	RGB 178 204 229	#B2CCE5
83.3%	83.3% #C3D7EB	RGB 195 215 235	#C3D7EB
100.0%	100.0% #D5E3F1	RGB 213 227 241	#D5E3F1

#6C9ECE #7DA9D3 #8FB5D9 #A0C0DF #B2CCE5 #C3D7EB #D5E3F1

#6C9ECE - #D5E3F1

HSV Blend

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

0.0%	0.0% #6C9ECE	RGB 108 158 206	#6C9ECE
16.7%	16.7% #7BA8D3	RGB 123 168 211	#7BA8D3
33.3%	33.3% #8CB3D9	RGB 140 179 217	#8CB3D9
50.0%	50.0% #9DBEDF	RGB 157 190 223	#9DBEDF
66.7%	66.7% #AFCAE5	RGB 175 202 229	#AFCAE5
83.3%	83.3% #C1D6EB	RGB 193 214 235	#C1D6EB
100.0%	100.0% #D5E3F1	RGB 213 227 241	#D5E3F1

#6C9ECE #7BA8D3 #8CB3D9 #9DBEDF #AFCAE5 #C1D6EB #D5E3F1

#6C9ECE - #9DBEDF - #D5E3F1

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #6C9ECE 0%, #9DBEDF 50%, #D5E3F1 100%);
    background: -webkit-linear-gradient(top, #6C9ECE 0%, #9DBEDF 50%, #D5E3F1 100%);
    background: linear-gradient(to bottom, #6C9ECE 0%, #9DBEDF 50%, #D5E3F1 100%);
}
</style>