#BCCDDF - #5A65A0 | 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 #BCCDDF to #5A65A0

#BCCDDF #5A65A0

Calculate the color between two colors, #BCCDDF and #5A65A0. 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)

#BCCDDF - #5A65A0 | 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 #BCCDDF as 0% and #5A65A0 as 100%.

0.0%	0.0% #BCCDDF	RGB 188 205 223	#BCCDDF
16.7%	16.7% #ABBBD4	RGB 171 187 212	#ABBBD4
33.3%	33.3% #9BAACA	RGB 155 170 202	#9BAACA
50.0%	50.0% #8B99BF	RGB 139 153 191	#8B99BF
66.7%	66.7% #7A87B5	RGB 122 135 181	#7A87B5
83.3%	83.3% #6A76AA	RGB 106 118 170	#6A76AA
100.0%	100.0% #5A65A0	RGB 90 101 160	#5A65A0

#BCCDDF #ABBBD4 #9BAACA #8B99BF #7A87B5 #6A76AA #5A65A0

#BCCDDF - #5A65A0

HSV Blend

#BCCDDF - #5A65A0 | 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 #BCCDDF as 0% and #5A65A0 as 100%.

0.0%	0.0% #BCCDDF	RGB 188 205 223	#BCCDDF
16.7%	16.7% #A9BBD4	RGB 169 187 212	#A9BBD4
33.3%	33.3% #97AACA	RGB 151 170 202	#97AACA
50.0%	50.0% #8698BF	RGB 134 152 191	#8698BF
66.7%	66.7% #7687B5	RGB 118 135 181	#7687B5
83.3%	83.3% #6775AA	RGB 103 117 170	#6775AA
100.0%	100.0% #5A65A0	RGB 90 101 160	#5A65A0

#BCCDDF #A9BBD4 #97AACA #8698BF #7687B5 #6775AA #5A65A0

#BCCDDF - #8698BF - #5A65A0

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #BCCDDF 0%, #8698BF 50%, #5A65A0 100%);
    background: -webkit-linear-gradient(top, #BCCDDF 0%, #8698BF 50%, #5A65A0 100%);
    background: linear-gradient(to bottom, #BCCDDF 0%, #8698BF 50%, #5A65A0 100%);
}
</style>