#CECEFA - #697FCC | 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 #CECEFA to #697FCC

#CECEFA #697FCC

Calculate the color between two colors, #CECEFA and #697FCC. 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)

#CECEFA - #697FCC | 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 #CECEFA as 0% and #697FCC as 100%.

0.0%	0.0% #CECEFA	RGB 206 206 250	#CECEFA
16.7%	16.7% #BDC0F2	RGB 189 192 242	#BDC0F2
33.3%	33.3% #ACB3EA	RGB 172 179 234	#ACB3EA
50.0%	50.0% #9BA6E3	RGB 155 166 227	#9BA6E3
66.7%	66.7% #8A99DB	RGB 138 153 219	#8A99DB
83.3%	83.3% #798CD3	RGB 121 140 211	#798CD3
100.0%	100.0% #697FCC	RGB 105 127 204	#697FCC

#CECEFA #BDC0F2 #ACB3EA #9BA6E3 #8A99DB #798CD3 #697FCC

#CECEFA - #697FCC

HSV Blend

#CECEFA - #697FCC | 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 #CECEFA as 0% and #697FCC as 100%.

0.0%	0.0% #CECEFA	RGB 206 206 250	#CECEFA
16.7%	16.7% #BBBDF2	RGB 187 189 242	#BBBDF2
33.3%	33.3% #A9AEEA	RGB 169 174 234	#A9AEEA
50.0%	50.0% #97A0E3	RGB 151 160 227	#97A0E3
66.7%	66.7% #8793DB	RGB 135 147 219	#8793DB
83.3%	83.3% #7788D3	RGB 119 136 211	#7788D3
100.0%	100.0% #697FCC	RGB 105 127 204	#697FCC

#CECEFA #BBBDF2 #A9AEEA #97A0E3 #8793DB #7788D3 #697FCC

#CECEFA - #97A0E3 - #697FCC

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #CECEFA 0%, #97A0E3 50%, #697FCC 100%);
    background: -webkit-linear-gradient(top, #CECEFA 0%, #97A0E3 50%, #697FCC 100%);
    background: linear-gradient(to bottom, #CECEFA 0%, #97A0E3 50%, #697FCC 100%);
}
</style>