#BFD6EC - #658AB9 | 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 #BFD6EC to #658AB9

#BFD6EC #658AB9

Calculate the color between two colors, #BFD6EC and #658AB9. 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)

#BFD6EC - #658AB9 | 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 #BFD6EC as 0% and #658AB9 as 100%.

0.0%	0.0% #BFD6EC	RGB 191 214 236	#BFD6EC
16.7%	16.7% #B0C9E3	RGB 176 201 227	#B0C9E3
33.3%	33.3% #A1BCDB	RGB 161 188 219	#A1BCDB
50.0%	50.0% #92B0D2	RGB 146 176 210	#92B0D2
66.7%	66.7% #83A3CA	RGB 131 163 202	#83A3CA
83.3%	83.3% #7496C1	RGB 116 150 193	#7496C1
100.0%	100.0% #658AB9	RGB 101 138 185	#658AB9

#BFD6EC #B0C9E3 #A1BCDB #92B0D2 #83A3CA #7496C1 #658AB9

#BFD6EC - #658AB9

HSV Blend

#BFD6EC - #658AB9 | 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 #BFD6EC as 0% and #658AB9 as 100%.

0.0%	0.0% #BFD6EC	RGB 191 214 236	#BFD6EC
16.7%	16.7% #AEC8E3	RGB 174 200 227	#AEC8E3
33.3%	33.3% #9EBBDB	RGB 158 187 219	#9EBBDB
50.0%	50.0% #8EAED2	RGB 142 174 210	#8EAED2
66.7%	66.7% #80A2CA	RGB 128 162 202	#80A2CA
83.3%	83.3% #7296C1	RGB 114 150 193	#7296C1
100.0%	100.0% #658AB9	RGB 101 138 185	#658AB9

#BFD6EC #AEC8E3 #9EBBDB #8EAED2 #80A2CA #7296C1 #658AB9

#BFD6EC - #8EAED2 - #658AB9

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #BFD6EC 0%, #8EAED2 50%, #658AB9 100%);
    background: -webkit-linear-gradient(top, #BFD6EC 0%, #8EAED2 50%, #658AB9 100%);
    background: linear-gradient(to bottom, #BFD6EC 0%, #8EAED2 50%, #658AB9 100%);
}
</style>