#C3D0FF - #586BDF | 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 #C3D0FF to #586BDF

#C3D0FF #586BDF

Calculate the color between two colors, #C3D0FF and #586BDF. 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)

#C3D0FF - #586BDF | 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 #C3D0FF as 0% and #586BDF as 100%.

0.0%	0.0% #C3D0FF	RGB 195 208 255	#C3D0FF
16.7%	16.7% #B1BFF9	RGB 177 191 249	#B1BFF9
33.3%	33.3% #9FAEF4	RGB 159 174 244	#9FAEF4
50.0%	50.0% #8D9DEF	RGB 141 157 239	#8D9DEF
66.7%	66.7% #7B8CE9	RGB 123 140 233	#7B8CE9
83.3%	83.3% #697BE4	RGB 105 123 228	#697BE4
100.0%	100.0% #586BDF	RGB 88 107 223	#586BDF

#C3D0FF #B1BFF9 #9FAEF4 #8D9DEF #7B8CE9 #697BE4 #586BDF

#C3D0FF - #586BDF

HSV Blend

#C3D0FF - #586BDF | 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 #C3D0FF as 0% and #586BDF as 100%.

0.0%	0.0% #C3D0FF	RGB 195 208 255	#C3D0FF
16.7%	16.7% #AFBEF9	RGB 175 190 249	#AFBEF9
33.3%	33.3% #9CADF4	RGB 156 173 244	#9CADF4
50.0%	50.0% #8A9CEF	RGB 138 156 239	#8A9CEF
66.7%	66.7% #798BE9	RGB 121 139 233	#798BE9
83.3%	83.3% #687BE4	RGB 104 123 228	#687BE4
100.0%	100.0% #586BDF	RGB 88 107 223	#586BDF

#C3D0FF #AFBEF9 #9CADF4 #8A9CEF #798BE9 #687BE4 #586BDF

#C3D0FF - #8A9CEF - #586BDF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #C3D0FF 0%, #8A9CEF 50%, #586BDF 100%);
    background: -webkit-linear-gradient(top, #C3D0FF 0%, #8A9CEF 50%, #586BDF 100%);
    background: linear-gradient(to bottom, #C3D0FF 0%, #8A9CEF 50%, #586BDF 100%);
}
</style>